@charset "UTF-8";
html,
body {
  height: 100%; }

body {
  overflow: hidden; }

.wrap {
  position: relative;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  transform-style: preserve-3d;
  perspective: 1000px;
  animation: rotate 42s infinite linear; }

@keyframes rotate {
  100% {
    transform: rotateZ(360deg); } }
.c {
  position: absolute;
  border-radius: 50%;
  opacity: 0; }

.c {
  width: 11px;
  height: 11px; }

.c:nth-child(1) {
  animation: orbit1 14s infinite;
  animation-delay: 0.01s;
  background-color: rgba(255, 255, 255, 0.4);
  width: 11px;
  height: 11px; }

@keyframes orbit1 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-287deg) rotateY(9deg) translateX(333px) rotateZ(287deg); }
  80% {
    transform: rotateZ(-287deg) rotateY(9deg) translateX(333px) rotateZ(287deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-287deg) rotateY(9deg) translateX(999px) rotateZ(287deg); } }
.c {
  width: 28px;
  height: 28px; }

.c:nth-child(2) {
  animation: orbit2 14s infinite;
  animation-delay: 0.02s;
  background-color: white;
  width: 28px;
  height: 28px; }

@keyframes orbit2 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-50deg) rotateY(1deg) translateX(327px) rotateZ(50deg); }
  80% {
    transform: rotateZ(-50deg) rotateY(1deg) translateX(327px) rotateZ(50deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-50deg) rotateY(1deg) translateX(981px) rotateZ(50deg); } }
.c {
  width: 13px;
  height: 13px; }

.c:nth-child(3) {
  animation: orbit3 14s infinite;
  animation-delay: 0.03s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 13px;
  height: 13px; }

@keyframes orbit3 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-61deg) rotateY(1deg) translateX(306px) rotateZ(61deg); }
  80% {
    transform: rotateZ(-61deg) rotateY(1deg) translateX(306px) rotateZ(61deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-61deg) rotateY(1deg) translateX(918px) rotateZ(61deg); } }
.c {
  width: 24px;
  height: 24px; }

.c:nth-child(4) {
  animation: orbit4 14s infinite;
  animation-delay: 0.04s;
  background-color: rgba(255, 255, 255, 0.6);
  width: 24px;
  height: 24px; }

@keyframes orbit4 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-152deg) rotateY(5deg) translateX(316px) rotateZ(152deg); }
  80% {
    transform: rotateZ(-152deg) rotateY(5deg) translateX(316px) rotateZ(152deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-152deg) rotateY(5deg) translateX(948px) rotateZ(152deg); } }
.c {
  width: 22px;
  height: 22px; }

.c:nth-child(5) {
  animation: orbit5 14s infinite;
  animation-delay: 0.05s;
  background-color: white;
  width: 22px;
  height: 22px; }

@keyframes orbit5 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-232deg) rotateY(1deg) translateX(312px) rotateZ(232deg); }
  80% {
    transform: rotateZ(-232deg) rotateY(1deg) translateX(312px) rotateZ(232deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-232deg) rotateY(1deg) translateX(936px) rotateZ(232deg); } }
.c {
  width: 19px;
  height: 19px; }

.c:nth-child(6) {
  animation: orbit6 14s infinite;
  animation-delay: 0.06s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 19px;
  height: 19px; }

@keyframes orbit6 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-139deg) rotateY(8deg) translateX(316px) rotateZ(139deg); }
  80% {
    transform: rotateZ(-139deg) rotateY(8deg) translateX(316px) rotateZ(139deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-139deg) rotateY(8deg) translateX(948px) rotateZ(139deg); } }
.c {
  width: 28px;
  height: 28px; }

.c:nth-child(7) {
  animation: orbit7 14s infinite;
  animation-delay: 0.07s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 28px;
  height: 28px; }

@keyframes orbit7 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-58deg) rotateY(8deg) translateX(319px) rotateZ(58deg); }
  80% {
    transform: rotateZ(-58deg) rotateY(8deg) translateX(319px) rotateZ(58deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-58deg) rotateY(8deg) translateX(957px) rotateZ(58deg); } }
.c {
  width: 20px;
  height: 20px; }

.c:nth-child(8) {
  animation: orbit8 14s infinite;
  animation-delay: 0.08s;
  background-color: rgba(255, 255, 255, 0.6);
  width: 20px;
  height: 20px; }

@keyframes orbit8 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-51deg) rotateY(5deg) translateX(316px) rotateZ(51deg); }
  80% {
    transform: rotateZ(-51deg) rotateY(5deg) translateX(316px) rotateZ(51deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-51deg) rotateY(5deg) translateX(948px) rotateZ(51deg); } }
.c {
  width: 8px;
  height: 8px; }

.c:nth-child(9) {
  animation: orbit9 14s infinite;
  animation-delay: 0.09s;
  background-color: rgba(255, 255, 255, 0.9);
  width: 8px;
  height: 8px; }

@keyframes orbit9 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-304deg) rotateY(5deg) translateX(304px) rotateZ(304deg); }
  80% {
    transform: rotateZ(-304deg) rotateY(5deg) translateX(304px) rotateZ(304deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-304deg) rotateY(5deg) translateX(912px) rotateZ(304deg); } }
.c {
  width: 12px;
  height: 12px; }

.c:nth-child(10) {
  animation: orbit10 14s infinite;
  animation-delay: 0.1s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 12px;
  height: 12px; }

@keyframes orbit10 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-158deg) rotateY(6deg) translateX(324px) rotateZ(158deg); }
  80% {
    transform: rotateZ(-158deg) rotateY(6deg) translateX(324px) rotateZ(158deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-158deg) rotateY(6deg) translateX(972px) rotateZ(158deg); } }
.c {
  width: 3px;
  height: 3px; }

.c:nth-child(11) {
  animation: orbit11 14s infinite;
  animation-delay: 0.11s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 3px;
  height: 3px; }

@keyframes orbit11 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-29deg) rotateY(4deg) translateX(304px) rotateZ(29deg); }
  80% {
    transform: rotateZ(-29deg) rotateY(4deg) translateX(304px) rotateZ(29deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-29deg) rotateY(4deg) translateX(912px) rotateZ(29deg); } }
.c {
  width: 2px;
  height: 2px; }

.c:nth-child(12) {
  animation: orbit12 14s infinite;
  animation-delay: 0.12s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 2px;
  height: 2px; }

@keyframes orbit12 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-190deg) rotateY(6deg) translateX(341px) rotateZ(190deg); }
  80% {
    transform: rotateZ(-190deg) rotateY(6deg) translateX(341px) rotateZ(190deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-190deg) rotateY(6deg) translateX(1023px) rotateZ(190deg); } }
.c {
  width: 8px;
  height: 8px; }

.c:nth-child(13) {
  animation: orbit13 14s infinite;
  animation-delay: 0.13s;
  background-color: rgba(255, 255, 255, 0.4);
  width: 8px;
  height: 8px; }

@keyframes orbit13 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-342deg) rotateY(6deg) translateX(335px) rotateZ(342deg); }
  80% {
    transform: rotateZ(-342deg) rotateY(6deg) translateX(335px) rotateZ(342deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-342deg) rotateY(6deg) translateX(1005px) rotateZ(342deg); } }
.c {
  width: 14px;
  height: 14px; }

.c:nth-child(14) {
  animation: orbit14 14s infinite;
  animation-delay: 0.14s;
  background-color: rgba(255, 255, 255, 0.5);
  width: 14px;
  height: 14px; }

@keyframes orbit14 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-80deg) rotateY(3deg) translateX(316px) rotateZ(80deg); }
  80% {
    transform: rotateZ(-80deg) rotateY(3deg) translateX(316px) rotateZ(80deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-80deg) rotateY(3deg) translateX(948px) rotateZ(80deg); } }
.c {
  width: 5px;
  height: 5px; }

.c:nth-child(15) {
  animation: orbit15 14s infinite;
  animation-delay: 0.15s;
  background-color: rgba(255, 255, 255, 0.9);
  width: 5px;
  height: 5px; }

@keyframes orbit15 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-242deg) rotateY(4deg) translateX(330px) rotateZ(242deg); }
  80% {
    transform: rotateZ(-242deg) rotateY(4deg) translateX(330px) rotateZ(242deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-242deg) rotateY(4deg) translateX(990px) rotateZ(242deg); } }
.c {
  width: 30px;
  height: 30px; }

.c:nth-child(16) {
  animation: orbit16 14s infinite;
  animation-delay: 0.16s;
  background-color: rgba(255, 255, 255, 0.2);
  width: 30px;
  height: 30px; }

@keyframes orbit16 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-302deg) rotateY(4deg) translateX(334px) rotateZ(302deg); }
  80% {
    transform: rotateZ(-302deg) rotateY(4deg) translateX(334px) rotateZ(302deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-302deg) rotateY(4deg) translateX(1002px) rotateZ(302deg); } }
.c {
  width: 22px;
  height: 22px; }

.c:nth-child(17) {
  animation: orbit17 14s infinite;
  animation-delay: 0.17s;
  background-color: white;
  width: 22px;
  height: 22px; }

@keyframes orbit17 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-34deg) rotateY(8deg) translateX(315px) rotateZ(34deg); }
  80% {
    transform: rotateZ(-34deg) rotateY(8deg) translateX(315px) rotateZ(34deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-34deg) rotateY(8deg) translateX(945px) rotateZ(34deg); } }
.c {
  width: 15px;
  height: 15px; }

.c:nth-child(18) {
  animation: orbit18 14s infinite;
  animation-delay: 0.18s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 15px;
  height: 15px; }

@keyframes orbit18 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-116deg) rotateY(7deg) translateX(323px) rotateZ(116deg); }
  80% {
    transform: rotateZ(-116deg) rotateY(7deg) translateX(323px) rotateZ(116deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-116deg) rotateY(7deg) translateX(969px) rotateZ(116deg); } }
.c {
  width: 2px;
  height: 2px; }

.c:nth-child(19) {
  animation: orbit19 14s infinite;
  animation-delay: 0.19s;
  background-color: rgba(255, 255, 255, 0.6);
  width: 2px;
  height: 2px; }

@keyframes orbit19 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-75deg) rotateY(3deg) translateX(328px) rotateZ(75deg); }
  80% {
    transform: rotateZ(-75deg) rotateY(3deg) translateX(328px) rotateZ(75deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-75deg) rotateY(3deg) translateX(984px) rotateZ(75deg); } }
.c {
  width: 1px;
  height: 1px; }

.c:nth-child(20) {
  animation: orbit20 14s infinite;
  animation-delay: 0.2s;
  background-color: rgba(255, 255, 255, 0.8);
  width: 1px;
  height: 1px; }

@keyframes orbit20 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-281deg) rotateY(7deg) translateX(314px) rotateZ(281deg); }
  80% {
    transform: rotateZ(-281deg) rotateY(7deg) translateX(314px) rotateZ(281deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-281deg) rotateY(7deg) translateX(942px) rotateZ(281deg); } }
.c {
  width: 12px;
  height: 12px; }

.c:nth-child(21) {
  animation: orbit21 14s infinite;
  animation-delay: 0.21s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 12px;
  height: 12px; }

@keyframes orbit21 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-247deg) rotateY(8deg) translateX(334px) rotateZ(247deg); }
  80% {
    transform: rotateZ(-247deg) rotateY(8deg) translateX(334px) rotateZ(247deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-247deg) rotateY(8deg) translateX(1002px) rotateZ(247deg); } }
.c {
  width: 30px;
  height: 30px; }

.c:nth-child(22) {
  animation: orbit22 14s infinite;
  animation-delay: 0.22s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 30px;
  height: 30px; }

@keyframes orbit22 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-205deg) rotateY(7deg) translateX(348px) rotateZ(205deg); }
  80% {
    transform: rotateZ(-205deg) rotateY(7deg) translateX(348px) rotateZ(205deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-205deg) rotateY(7deg) translateX(1044px) rotateZ(205deg); } }
.c {
  width: 12px;
  height: 12px; }

.c:nth-child(23) {
  animation: orbit23 14s infinite;
  animation-delay: 0.23s;
  background-color: rgba(255, 255, 255, 0.4);
  width: 12px;
  height: 12px; }

@keyframes orbit23 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-347deg) rotateY(4deg) translateX(342px) rotateZ(347deg); }
  80% {
    transform: rotateZ(-347deg) rotateY(4deg) translateX(342px) rotateZ(347deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-347deg) rotateY(4deg) translateX(1026px) rotateZ(347deg); } }
.c {
  width: 16px;
  height: 16px; }

.c:nth-child(24) {
  animation: orbit24 14s infinite;
  animation-delay: 0.24s;
  background-color: white;
  width: 16px;
  height: 16px; }

@keyframes orbit24 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-266deg) rotateY(1deg) translateX(320px) rotateZ(266deg); }
  80% {
    transform: rotateZ(-266deg) rotateY(1deg) translateX(320px) rotateZ(266deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-266deg) rotateY(1deg) translateX(960px) rotateZ(266deg); } }
.c {
  width: 15px;
  height: 15px; }

.c:nth-child(25) {
  animation: orbit25 14s infinite;
  animation-delay: 0.25s;
  background-color: white;
  width: 15px;
  height: 15px; }

@keyframes orbit25 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-190deg) rotateY(6deg) translateX(326px) rotateZ(190deg); }
  80% {
    transform: rotateZ(-190deg) rotateY(6deg) translateX(326px) rotateZ(190deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-190deg) rotateY(6deg) translateX(978px) rotateZ(190deg); } }
.c {
  width: 28px;
  height: 28px; }

.c:nth-child(26) {
  animation: orbit26 14s infinite;
  animation-delay: 0.26s;
  background-color: rgba(255, 255, 255, 0.8);
  width: 28px;
  height: 28px; }

@keyframes orbit26 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-135deg) rotateY(10deg) translateX(309px) rotateZ(135deg); }
  80% {
    transform: rotateZ(-135deg) rotateY(10deg) translateX(309px) rotateZ(135deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-135deg) rotateY(10deg) translateX(927px) rotateZ(135deg); } }
.c {
  width: 17px;
  height: 17px; }

.c:nth-child(27) {
  animation: orbit27 14s infinite;
  animation-delay: 0.27s;
  background-color: rgba(255, 255, 255, 0.6);
  width: 17px;
  height: 17px; }

@keyframes orbit27 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-129deg) rotateY(5deg) translateX(325px) rotateZ(129deg); }
  80% {
    transform: rotateZ(-129deg) rotateY(5deg) translateX(325px) rotateZ(129deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-129deg) rotateY(5deg) translateX(975px) rotateZ(129deg); } }
.c {
  width: 18px;
  height: 18px; }

.c:nth-child(28) {
  animation: orbit28 14s infinite;
  animation-delay: 0.28s;
  background-color: rgba(255, 255, 255, 0.5);
  width: 18px;
  height: 18px; }

@keyframes orbit28 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-2deg) rotateY(8deg) translateX(330px) rotateZ(2deg); }
  80% {
    transform: rotateZ(-2deg) rotateY(8deg) translateX(330px) rotateZ(2deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-2deg) rotateY(8deg) translateX(990px) rotateZ(2deg); } }
.c {
  width: 22px;
  height: 22px; }

.c:nth-child(29) {
  animation: orbit29 14s infinite;
  animation-delay: 0.29s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 22px;
  height: 22px; }

@keyframes orbit29 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-160deg) rotateY(7deg) translateX(313px) rotateZ(160deg); }
  80% {
    transform: rotateZ(-160deg) rotateY(7deg) translateX(313px) rotateZ(160deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-160deg) rotateY(7deg) translateX(939px) rotateZ(160deg); } }
.c {
  width: 26px;
  height: 26px; }

.c:nth-child(30) {
  animation: orbit30 14s infinite;
  animation-delay: 0.3s;
  background-color: rgba(255, 255, 255, 0.6);
  width: 26px;
  height: 26px; }

@keyframes orbit30 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-170deg) rotateY(6deg) translateX(303px) rotateZ(170deg); }
  80% {
    transform: rotateZ(-170deg) rotateY(6deg) translateX(303px) rotateZ(170deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-170deg) rotateY(6deg) translateX(909px) rotateZ(170deg); } }
.c {
  width: 21px;
  height: 21px; }

.c:nth-child(31) {
  animation: orbit31 14s infinite;
  animation-delay: 0.31s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 21px;
  height: 21px; }

@keyframes orbit31 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-89deg) rotateY(4deg) translateX(341px) rotateZ(89deg); }
  80% {
    transform: rotateZ(-89deg) rotateY(4deg) translateX(341px) rotateZ(89deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-89deg) rotateY(4deg) translateX(1023px) rotateZ(89deg); } }
.c {
  width: 18px;
  height: 18px; }

.c:nth-child(32) {
  animation: orbit32 14s infinite;
  animation-delay: 0.32s;
  background-color: rgba(255, 255, 255, 0.9);
  width: 18px;
  height: 18px; }

@keyframes orbit32 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-92deg) rotateY(3deg) translateX(317px) rotateZ(92deg); }
  80% {
    transform: rotateZ(-92deg) rotateY(3deg) translateX(317px) rotateZ(92deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-92deg) rotateY(3deg) translateX(951px) rotateZ(92deg); } }
.c {
  width: 4px;
  height: 4px; }

.c:nth-child(33) {
  animation: orbit33 14s infinite;
  animation-delay: 0.33s;
  background-color: rgba(255, 255, 255, 0.4);
  width: 4px;
  height: 4px; }

@keyframes orbit33 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-148deg) rotateY(3deg) translateX(328px) rotateZ(148deg); }
  80% {
    transform: rotateZ(-148deg) rotateY(3deg) translateX(328px) rotateZ(148deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-148deg) rotateY(3deg) translateX(984px) rotateZ(148deg); } }
.c {
  width: 13px;
  height: 13px; }

.c:nth-child(34) {
  animation: orbit34 14s infinite;
  animation-delay: 0.34s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 13px;
  height: 13px; }

@keyframes orbit34 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-290deg) rotateY(10deg) translateX(327px) rotateZ(290deg); }
  80% {
    transform: rotateZ(-290deg) rotateY(10deg) translateX(327px) rotateZ(290deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-290deg) rotateY(10deg) translateX(981px) rotateZ(290deg); } }
.c {
  width: 20px;
  height: 20px; }

.c:nth-child(35) {
  animation: orbit35 14s infinite;
  animation-delay: 0.35s;
  background-color: rgba(255, 255, 255, 0.5);
  width: 20px;
  height: 20px; }

@keyframes orbit35 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-51deg) rotateY(10deg) translateX(312px) rotateZ(51deg); }
  80% {
    transform: rotateZ(-51deg) rotateY(10deg) translateX(312px) rotateZ(51deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-51deg) rotateY(10deg) translateX(936px) rotateZ(51deg); } }
.c {
  width: 6px;
  height: 6px; }

.c:nth-child(36) {
  animation: orbit36 14s infinite;
  animation-delay: 0.36s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 6px;
  height: 6px; }

@keyframes orbit36 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-339deg) rotateY(8deg) translateX(319px) rotateZ(339deg); }
  80% {
    transform: rotateZ(-339deg) rotateY(8deg) translateX(319px) rotateZ(339deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-339deg) rotateY(8deg) translateX(957px) rotateZ(339deg); } }
.c {
  width: 29px;
  height: 29px; }

.c:nth-child(37) {
  animation: orbit37 14s infinite;
  animation-delay: 0.37s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 29px;
  height: 29px; }

@keyframes orbit37 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-44deg) rotateY(8deg) translateX(302px) rotateZ(44deg); }
  80% {
    transform: rotateZ(-44deg) rotateY(8deg) translateX(302px) rotateZ(44deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-44deg) rotateY(8deg) translateX(906px) rotateZ(44deg); } }
.c {
  width: 6px;
  height: 6px; }

.c:nth-child(38) {
  animation: orbit38 14s infinite;
  animation-delay: 0.38s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 6px;
  height: 6px; }

@keyframes orbit38 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-116deg) rotateY(7deg) translateX(337px) rotateZ(116deg); }
  80% {
    transform: rotateZ(-116deg) rotateY(7deg) translateX(337px) rotateZ(116deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-116deg) rotateY(7deg) translateX(1011px) rotateZ(116deg); } }
.c {
  width: 12px;
  height: 12px; }

.c:nth-child(39) {
  animation: orbit39 14s infinite;
  animation-delay: 0.39s;
  background-color: rgba(255, 255, 255, 0.4);
  width: 12px;
  height: 12px; }

@keyframes orbit39 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-37deg) rotateY(9deg) translateX(302px) rotateZ(37deg); }
  80% {
    transform: rotateZ(-37deg) rotateY(9deg) translateX(302px) rotateZ(37deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-37deg) rotateY(9deg) translateX(906px) rotateZ(37deg); } }
.c {
  width: 29px;
  height: 29px; }

.c:nth-child(40) {
  animation: orbit40 14s infinite;
  animation-delay: 0.4s;
  background-color: rgba(255, 255, 255, 0.8);
  width: 29px;
  height: 29px; }

@keyframes orbit40 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-97deg) rotateY(5deg) translateX(334px) rotateZ(97deg); }
  80% {
    transform: rotateZ(-97deg) rotateY(5deg) translateX(334px) rotateZ(97deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-97deg) rotateY(5deg) translateX(1002px) rotateZ(97deg); } }
.c {
  width: 2px;
  height: 2px; }

.c:nth-child(41) {
  animation: orbit41 14s infinite;
  animation-delay: 0.41s;
  background-color: rgba(255, 255, 255, 0.4);
  width: 2px;
  height: 2px; }

@keyframes orbit41 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-85deg) rotateY(5deg) translateX(343px) rotateZ(85deg); }
  80% {
    transform: rotateZ(-85deg) rotateY(5deg) translateX(343px) rotateZ(85deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-85deg) rotateY(5deg) translateX(1029px) rotateZ(85deg); } }
.c {
  width: 29px;
  height: 29px; }

.c:nth-child(42) {
  animation: orbit42 14s infinite;
  animation-delay: 0.42s;
  background-color: rgba(255, 255, 255, 0.9);
  width: 29px;
  height: 29px; }

@keyframes orbit42 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-245deg) rotateY(4deg) translateX(306px) rotateZ(245deg); }
  80% {
    transform: rotateZ(-245deg) rotateY(4deg) translateX(306px) rotateZ(245deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-245deg) rotateY(4deg) translateX(918px) rotateZ(245deg); } }
.c {
  width: 4px;
  height: 4px; }

.c:nth-child(43) {
  animation: orbit43 14s infinite;
  animation-delay: 0.43s;
  background-color: rgba(255, 255, 255, 0.2);
  width: 4px;
  height: 4px; }

@keyframes orbit43 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-72deg) rotateY(7deg) translateX(344px) rotateZ(72deg); }
  80% {
    transform: rotateZ(-72deg) rotateY(7deg) translateX(344px) rotateZ(72deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-72deg) rotateY(7deg) translateX(1032px) rotateZ(72deg); } }
.c {
  width: 27px;
  height: 27px; }

.c:nth-child(44) {
  animation: orbit44 14s infinite;
  animation-delay: 0.44s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 27px;
  height: 27px; }

@keyframes orbit44 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-161deg) rotateY(9deg) translateX(336px) rotateZ(161deg); }
  80% {
    transform: rotateZ(-161deg) rotateY(9deg) translateX(336px) rotateZ(161deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-161deg) rotateY(9deg) translateX(1008px) rotateZ(161deg); } }
.c {
  width: 9px;
  height: 9px; }

.c:nth-child(45) {
  animation: orbit45 14s infinite;
  animation-delay: 0.45s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 9px;
  height: 9px; }

@keyframes orbit45 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-254deg) rotateY(5deg) translateX(322px) rotateZ(254deg); }
  80% {
    transform: rotateZ(-254deg) rotateY(5deg) translateX(322px) rotateZ(254deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-254deg) rotateY(5deg) translateX(966px) rotateZ(254deg); } }
.c {
  width: 21px;
  height: 21px; }

.c:nth-child(46) {
  animation: orbit46 14s infinite;
  animation-delay: 0.46s;
  background-color: white;
  width: 21px;
  height: 21px; }

@keyframes orbit46 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-243deg) rotateY(4deg) translateX(301px) rotateZ(243deg); }
  80% {
    transform: rotateZ(-243deg) rotateY(4deg) translateX(301px) rotateZ(243deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-243deg) rotateY(4deg) translateX(903px) rotateZ(243deg); } }
.c {
  width: 5px;
  height: 5px; }

.c:nth-child(47) {
  animation: orbit47 14s infinite;
  animation-delay: 0.47s;
  background-color: rgba(255, 255, 255, 0.2);
  width: 5px;
  height: 5px; }

@keyframes orbit47 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-92deg) rotateY(1deg) translateX(326px) rotateZ(92deg); }
  80% {
    transform: rotateZ(-92deg) rotateY(1deg) translateX(326px) rotateZ(92deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-92deg) rotateY(1deg) translateX(978px) rotateZ(92deg); } }
.c {
  width: 15px;
  height: 15px; }

.c:nth-child(48) {
  animation: orbit48 14s infinite;
  animation-delay: 0.48s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 15px;
  height: 15px; }

@keyframes orbit48 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-139deg) rotateY(7deg) translateX(336px) rotateZ(139deg); }
  80% {
    transform: rotateZ(-139deg) rotateY(7deg) translateX(336px) rotateZ(139deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-139deg) rotateY(7deg) translateX(1008px) rotateZ(139deg); } }
.c {
  width: 13px;
  height: 13px; }

.c:nth-child(49) {
  animation: orbit49 14s infinite;
  animation-delay: 0.49s;
  background-color: white;
  width: 13px;
  height: 13px; }

@keyframes orbit49 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-47deg) rotateY(9deg) translateX(315px) rotateZ(47deg); }
  80% {
    transform: rotateZ(-47deg) rotateY(9deg) translateX(315px) rotateZ(47deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-47deg) rotateY(9deg) translateX(945px) rotateZ(47deg); } }
.c {
  width: 9px;
  height: 9px; }

.c:nth-child(50) {
  animation: orbit50 14s infinite;
  animation-delay: 0.5s;
  background-color: rgba(255, 255, 255, 0.9);
  width: 9px;
  height: 9px; }

@keyframes orbit50 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-124deg) rotateY(5deg) translateX(349px) rotateZ(124deg); }
  80% {
    transform: rotateZ(-124deg) rotateY(5deg) translateX(349px) rotateZ(124deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-124deg) rotateY(5deg) translateX(1047px) rotateZ(124deg); } }
.c {
  width: 1px;
  height: 1px; }

.c:nth-child(51) {
  animation: orbit51 14s infinite;
  animation-delay: 0.51s;
  background-color: rgba(255, 255, 255, 0.6);
  width: 1px;
  height: 1px; }

@keyframes orbit51 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-176deg) rotateY(2deg) translateX(314px) rotateZ(176deg); }
  80% {
    transform: rotateZ(-176deg) rotateY(2deg) translateX(314px) rotateZ(176deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-176deg) rotateY(2deg) translateX(942px) rotateZ(176deg); } }
.c {
  width: 16px;
  height: 16px; }

.c:nth-child(52) {
  animation: orbit52 14s infinite;
  animation-delay: 0.52s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 16px;
  height: 16px; }

@keyframes orbit52 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-320deg) rotateY(6deg) translateX(329px) rotateZ(320deg); }
  80% {
    transform: rotateZ(-320deg) rotateY(6deg) translateX(329px) rotateZ(320deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-320deg) rotateY(6deg) translateX(987px) rotateZ(320deg); } }
.c {
  width: 5px;
  height: 5px; }

.c:nth-child(53) {
  animation: orbit53 14s infinite;
  animation-delay: 0.53s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 5px;
  height: 5px; }

@keyframes orbit53 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-201deg) rotateY(4deg) translateX(348px) rotateZ(201deg); }
  80% {
    transform: rotateZ(-201deg) rotateY(4deg) translateX(348px) rotateZ(201deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-201deg) rotateY(4deg) translateX(1044px) rotateZ(201deg); } }
.c {
  width: 9px;
  height: 9px; }

.c:nth-child(54) {
  animation: orbit54 14s infinite;
  animation-delay: 0.54s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 9px;
  height: 9px; }

@keyframes orbit54 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-171deg) rotateY(10deg) translateX(302px) rotateZ(171deg); }
  80% {
    transform: rotateZ(-171deg) rotateY(10deg) translateX(302px) rotateZ(171deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-171deg) rotateY(10deg) translateX(906px) rotateZ(171deg); } }
.c {
  width: 8px;
  height: 8px; }

.c:nth-child(55) {
  animation: orbit55 14s infinite;
  animation-delay: 0.55s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 8px;
  height: 8px; }

@keyframes orbit55 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-160deg) rotateY(3deg) translateX(306px) rotateZ(160deg); }
  80% {
    transform: rotateZ(-160deg) rotateY(3deg) translateX(306px) rotateZ(160deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-160deg) rotateY(3deg) translateX(918px) rotateZ(160deg); } }
.c {
  width: 24px;
  height: 24px; }

.c:nth-child(56) {
  animation: orbit56 14s infinite;
  animation-delay: 0.56s;
  background-color: rgba(255, 255, 255, 0.6);
  width: 24px;
  height: 24px; }

@keyframes orbit56 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-149deg) rotateY(2deg) translateX(303px) rotateZ(149deg); }
  80% {
    transform: rotateZ(-149deg) rotateY(2deg) translateX(303px) rotateZ(149deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-149deg) rotateY(2deg) translateX(909px) rotateZ(149deg); } }
.c {
  width: 6px;
  height: 6px; }

.c:nth-child(57) {
  animation: orbit57 14s infinite;
  animation-delay: 0.57s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 6px;
  height: 6px; }

@keyframes orbit57 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-346deg) rotateY(5deg) translateX(348px) rotateZ(346deg); }
  80% {
    transform: rotateZ(-346deg) rotateY(5deg) translateX(348px) rotateZ(346deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-346deg) rotateY(5deg) translateX(1044px) rotateZ(346deg); } }
.c {
  width: 20px;
  height: 20px; }

.c:nth-child(58) {
  animation: orbit58 14s infinite;
  animation-delay: 0.58s;
  background-color: white;
  width: 20px;
  height: 20px; }

@keyframes orbit58 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-55deg) rotateY(8deg) translateX(349px) rotateZ(55deg); }
  80% {
    transform: rotateZ(-55deg) rotateY(8deg) translateX(349px) rotateZ(55deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-55deg) rotateY(8deg) translateX(1047px) rotateZ(55deg); } }
.c {
  width: 11px;
  height: 11px; }

.c:nth-child(59) {
  animation: orbit59 14s infinite;
  animation-delay: 0.59s;
  background-color: rgba(255, 255, 255, 0.2);
  width: 11px;
  height: 11px; }

@keyframes orbit59 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-265deg) rotateY(2deg) translateX(347px) rotateZ(265deg); }
  80% {
    transform: rotateZ(-265deg) rotateY(2deg) translateX(347px) rotateZ(265deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-265deg) rotateY(2deg) translateX(1041px) rotateZ(265deg); } }
.c {
  width: 19px;
  height: 19px; }

.c:nth-child(60) {
  animation: orbit60 14s infinite;
  animation-delay: 0.6s;
  background-color: white;
  width: 19px;
  height: 19px; }

@keyframes orbit60 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-172deg) rotateY(5deg) translateX(326px) rotateZ(172deg); }
  80% {
    transform: rotateZ(-172deg) rotateY(5deg) translateX(326px) rotateZ(172deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-172deg) rotateY(5deg) translateX(978px) rotateZ(172deg); } }
.c {
  width: 5px;
  height: 5px; }

.c:nth-child(61) {
  animation: orbit61 14s infinite;
  animation-delay: 0.61s;
  background-color: rgba(255, 255, 255, 0.6);
  width: 5px;
  height: 5px; }

@keyframes orbit61 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-29deg) rotateY(8deg) translateX(315px) rotateZ(29deg); }
  80% {
    transform: rotateZ(-29deg) rotateY(8deg) translateX(315px) rotateZ(29deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-29deg) rotateY(8deg) translateX(945px) rotateZ(29deg); } }
.c {
  width: 21px;
  height: 21px; }

.c:nth-child(62) {
  animation: orbit62 14s infinite;
  animation-delay: 0.62s;
  background-color: rgba(255, 255, 255, 0.8);
  width: 21px;
  height: 21px; }

@keyframes orbit62 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-58deg) rotateY(9deg) translateX(301px) rotateZ(58deg); }
  80% {
    transform: rotateZ(-58deg) rotateY(9deg) translateX(301px) rotateZ(58deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-58deg) rotateY(9deg) translateX(903px) rotateZ(58deg); } }
.c {
  width: 15px;
  height: 15px; }

.c:nth-child(63) {
  animation: orbit63 14s infinite;
  animation-delay: 0.63s;
  background-color: rgba(255, 255, 255, 0.8);
  width: 15px;
  height: 15px; }

@keyframes orbit63 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-105deg) rotateY(2deg) translateX(315px) rotateZ(105deg); }
  80% {
    transform: rotateZ(-105deg) rotateY(2deg) translateX(315px) rotateZ(105deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-105deg) rotateY(2deg) translateX(945px) rotateZ(105deg); } }
.c {
  width: 25px;
  height: 25px; }

.c:nth-child(64) {
  animation: orbit64 14s infinite;
  animation-delay: 0.64s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 25px;
  height: 25px; }

@keyframes orbit64 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-334deg) rotateY(10deg) translateX(345px) rotateZ(334deg); }
  80% {
    transform: rotateZ(-334deg) rotateY(10deg) translateX(345px) rotateZ(334deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-334deg) rotateY(10deg) translateX(1035px) rotateZ(334deg); } }
.c {
  width: 24px;
  height: 24px; }

.c:nth-child(65) {
  animation: orbit65 14s infinite;
  animation-delay: 0.65s;
  background-color: rgba(255, 255, 255, 0.5);
  width: 24px;
  height: 24px; }

@keyframes orbit65 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-349deg) rotateY(3deg) translateX(348px) rotateZ(349deg); }
  80% {
    transform: rotateZ(-349deg) rotateY(3deg) translateX(348px) rotateZ(349deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-349deg) rotateY(3deg) translateX(1044px) rotateZ(349deg); } }
.c {
  width: 1px;
  height: 1px; }

.c:nth-child(66) {
  animation: orbit66 14s infinite;
  animation-delay: 0.66s;
  background-color: rgba(255, 255, 255, 0.6);
  width: 1px;
  height: 1px; }

@keyframes orbit66 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-200deg) rotateY(7deg) translateX(310px) rotateZ(200deg); }
  80% {
    transform: rotateZ(-200deg) rotateY(7deg) translateX(310px) rotateZ(200deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-200deg) rotateY(7deg) translateX(930px) rotateZ(200deg); } }
.c {
  width: 5px;
  height: 5px; }

.c:nth-child(67) {
  animation: orbit67 14s infinite;
  animation-delay: 0.67s;
  background-color: rgba(255, 255, 255, 0.4);
  width: 5px;
  height: 5px; }

@keyframes orbit67 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-197deg) rotateY(7deg) translateX(337px) rotateZ(197deg); }
  80% {
    transform: rotateZ(-197deg) rotateY(7deg) translateX(337px) rotateZ(197deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-197deg) rotateY(7deg) translateX(1011px) rotateZ(197deg); } }
.c {
  width: 1px;
  height: 1px; }

.c:nth-child(68) {
  animation: orbit68 14s infinite;
  animation-delay: 0.68s;
  background-color: rgba(255, 255, 255, 0.2);
  width: 1px;
  height: 1px; }

@keyframes orbit68 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-153deg) rotateY(1deg) translateX(346px) rotateZ(153deg); }
  80% {
    transform: rotateZ(-153deg) rotateY(1deg) translateX(346px) rotateZ(153deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-153deg) rotateY(1deg) translateX(1038px) rotateZ(153deg); } }
.c {
  width: 15px;
  height: 15px; }

.c:nth-child(69) {
  animation: orbit69 14s infinite;
  animation-delay: 0.69s;
  background-color: rgba(255, 255, 255, 0.8);
  width: 15px;
  height: 15px; }

@keyframes orbit69 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-169deg) rotateY(1deg) translateX(318px) rotateZ(169deg); }
  80% {
    transform: rotateZ(-169deg) rotateY(1deg) translateX(318px) rotateZ(169deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-169deg) rotateY(1deg) translateX(954px) rotateZ(169deg); } }
.c {
  width: 21px;
  height: 21px; }

.c:nth-child(70) {
  animation: orbit70 14s infinite;
  animation-delay: 0.7s;
  background-color: rgba(255, 255, 255, 0.8);
  width: 21px;
  height: 21px; }

@keyframes orbit70 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-7deg) rotateY(8deg) translateX(345px) rotateZ(7deg); }
  80% {
    transform: rotateZ(-7deg) rotateY(8deg) translateX(345px) rotateZ(7deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-7deg) rotateY(8deg) translateX(1035px) rotateZ(7deg); } }
.c {
  width: 23px;
  height: 23px; }

.c:nth-child(71) {
  animation: orbit71 14s infinite;
  animation-delay: 0.71s;
  background-color: rgba(255, 255, 255, 0.4);
  width: 23px;
  height: 23px; }

@keyframes orbit71 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-207deg) rotateY(6deg) translateX(320px) rotateZ(207deg); }
  80% {
    transform: rotateZ(-207deg) rotateY(6deg) translateX(320px) rotateZ(207deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-207deg) rotateY(6deg) translateX(960px) rotateZ(207deg); } }
.c {
  width: 25px;
  height: 25px; }

.c:nth-child(72) {
  animation: orbit72 14s infinite;
  animation-delay: 0.72s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 25px;
  height: 25px; }

@keyframes orbit72 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-335deg) rotateY(10deg) translateX(321px) rotateZ(335deg); }
  80% {
    transform: rotateZ(-335deg) rotateY(10deg) translateX(321px) rotateZ(335deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-335deg) rotateY(10deg) translateX(963px) rotateZ(335deg); } }
.c {
  width: 15px;
  height: 15px; }

.c:nth-child(73) {
  animation: orbit73 14s infinite;
  animation-delay: 0.73s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 15px;
  height: 15px; }

@keyframes orbit73 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-158deg) rotateY(1deg) translateX(347px) rotateZ(158deg); }
  80% {
    transform: rotateZ(-158deg) rotateY(1deg) translateX(347px) rotateZ(158deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-158deg) rotateY(1deg) translateX(1041px) rotateZ(158deg); } }
.c {
  width: 8px;
  height: 8px; }

.c:nth-child(74) {
  animation: orbit74 14s infinite;
  animation-delay: 0.74s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 8px;
  height: 8px; }

@keyframes orbit74 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-42deg) rotateY(2deg) translateX(332px) rotateZ(42deg); }
  80% {
    transform: rotateZ(-42deg) rotateY(2deg) translateX(332px) rotateZ(42deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-42deg) rotateY(2deg) translateX(996px) rotateZ(42deg); } }
.c {
  width: 27px;
  height: 27px; }

.c:nth-child(75) {
  animation: orbit75 14s infinite;
  animation-delay: 0.75s;
  background-color: white;
  width: 27px;
  height: 27px; }

@keyframes orbit75 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-268deg) rotateY(10deg) translateX(347px) rotateZ(268deg); }
  80% {
    transform: rotateZ(-268deg) rotateY(10deg) translateX(347px) rotateZ(268deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-268deg) rotateY(10deg) translateX(1041px) rotateZ(268deg); } }
.c {
  width: 14px;
  height: 14px; }

.c:nth-child(76) {
  animation: orbit76 14s infinite;
  animation-delay: 0.76s;
  background-color: rgba(255, 255, 255, 0.9);
  width: 14px;
  height: 14px; }

@keyframes orbit76 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-352deg) rotateY(10deg) translateX(343px) rotateZ(352deg); }
  80% {
    transform: rotateZ(-352deg) rotateY(10deg) translateX(343px) rotateZ(352deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-352deg) rotateY(10deg) translateX(1029px) rotateZ(352deg); } }
.c {
  width: 10px;
  height: 10px; }

.c:nth-child(77) {
  animation: orbit77 14s infinite;
  animation-delay: 0.77s;
  background-color: rgba(255, 255, 255, 0.6);
  width: 10px;
  height: 10px; }

@keyframes orbit77 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-243deg) rotateY(3deg) translateX(339px) rotateZ(243deg); }
  80% {
    transform: rotateZ(-243deg) rotateY(3deg) translateX(339px) rotateZ(243deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-243deg) rotateY(3deg) translateX(1017px) rotateZ(243deg); } }
.c {
  width: 12px;
  height: 12px; }

.c:nth-child(78) {
  animation: orbit78 14s infinite;
  animation-delay: 0.78s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 12px;
  height: 12px; }

@keyframes orbit78 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-357deg) rotateY(1deg) translateX(347px) rotateZ(357deg); }
  80% {
    transform: rotateZ(-357deg) rotateY(1deg) translateX(347px) rotateZ(357deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-357deg) rotateY(1deg) translateX(1041px) rotateZ(357deg); } }
.c {
  width: 7px;
  height: 7px; }

.c:nth-child(79) {
  animation: orbit79 14s infinite;
  animation-delay: 0.79s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 7px;
  height: 7px; }

@keyframes orbit79 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-124deg) rotateY(2deg) translateX(345px) rotateZ(124deg); }
  80% {
    transform: rotateZ(-124deg) rotateY(2deg) translateX(345px) rotateZ(124deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-124deg) rotateY(2deg) translateX(1035px) rotateZ(124deg); } }
.c {
  width: 5px;
  height: 5px; }

.c:nth-child(80) {
  animation: orbit80 14s infinite;
  animation-delay: 0.8s;
  background-color: rgba(255, 255, 255, 0.5);
  width: 5px;
  height: 5px; }

@keyframes orbit80 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-21deg) rotateY(8deg) translateX(350px) rotateZ(21deg); }
  80% {
    transform: rotateZ(-21deg) rotateY(8deg) translateX(350px) rotateZ(21deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-21deg) rotateY(8deg) translateX(1050px) rotateZ(21deg); } }
.c {
  width: 29px;
  height: 29px; }

.c:nth-child(81) {
  animation: orbit81 14s infinite;
  animation-delay: 0.81s;
  background-color: rgba(255, 255, 255, 0.2);
  width: 29px;
  height: 29px; }

@keyframes orbit81 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-200deg) rotateY(2deg) translateX(319px) rotateZ(200deg); }
  80% {
    transform: rotateZ(-200deg) rotateY(2deg) translateX(319px) rotateZ(200deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-200deg) rotateY(2deg) translateX(957px) rotateZ(200deg); } }
.c {
  width: 11px;
  height: 11px; }

.c:nth-child(82) {
  animation: orbit82 14s infinite;
  animation-delay: 0.82s;
  background-color: rgba(255, 255, 255, 0.2);
  width: 11px;
  height: 11px; }

@keyframes orbit82 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-289deg) rotateY(5deg) translateX(320px) rotateZ(289deg); }
  80% {
    transform: rotateZ(-289deg) rotateY(5deg) translateX(320px) rotateZ(289deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-289deg) rotateY(5deg) translateX(960px) rotateZ(289deg); } }
.c {
  width: 7px;
  height: 7px; }

.c:nth-child(83) {
  animation: orbit83 14s infinite;
  animation-delay: 0.83s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 7px;
  height: 7px; }

@keyframes orbit83 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-91deg) rotateY(3deg) translateX(322px) rotateZ(91deg); }
  80% {
    transform: rotateZ(-91deg) rotateY(3deg) translateX(322px) rotateZ(91deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-91deg) rotateY(3deg) translateX(966px) rotateZ(91deg); } }
.c {
  width: 21px;
  height: 21px; }

.c:nth-child(84) {
  animation: orbit84 14s infinite;
  animation-delay: 0.84s;
  background-color: rgba(255, 255, 255, 0.5);
  width: 21px;
  height: 21px; }

@keyframes orbit84 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-329deg) rotateY(3deg) translateX(344px) rotateZ(329deg); }
  80% {
    transform: rotateZ(-329deg) rotateY(3deg) translateX(344px) rotateZ(329deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-329deg) rotateY(3deg) translateX(1032px) rotateZ(329deg); } }
.c {
  width: 23px;
  height: 23px; }

.c:nth-child(85) {
  animation: orbit85 14s infinite;
  animation-delay: 0.85s;
  background-color: white;
  width: 23px;
  height: 23px; }

@keyframes orbit85 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-196deg) rotateY(10deg) translateX(322px) rotateZ(196deg); }
  80% {
    transform: rotateZ(-196deg) rotateY(10deg) translateX(322px) rotateZ(196deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-196deg) rotateY(10deg) translateX(966px) rotateZ(196deg); } }
.c {
  width: 18px;
  height: 18px; }

.c:nth-child(86) {
  animation: orbit86 14s infinite;
  animation-delay: 0.86s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 18px;
  height: 18px; }

@keyframes orbit86 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-316deg) rotateY(9deg) translateX(307px) rotateZ(316deg); }
  80% {
    transform: rotateZ(-316deg) rotateY(9deg) translateX(307px) rotateZ(316deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-316deg) rotateY(9deg) translateX(921px) rotateZ(316deg); } }
.c {
  width: 12px;
  height: 12px; }

.c:nth-child(87) {
  animation: orbit87 14s infinite;
  animation-delay: 0.87s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 12px;
  height: 12px; }

@keyframes orbit87 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-150deg) rotateY(3deg) translateX(324px) rotateZ(150deg); }
  80% {
    transform: rotateZ(-150deg) rotateY(3deg) translateX(324px) rotateZ(150deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-150deg) rotateY(3deg) translateX(972px) rotateZ(150deg); } }
.c {
  width: 11px;
  height: 11px; }

.c:nth-child(88) {
  animation: orbit88 14s infinite;
  animation-delay: 0.88s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 11px;
  height: 11px; }

@keyframes orbit88 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-304deg) rotateY(7deg) translateX(305px) rotateZ(304deg); }
  80% {
    transform: rotateZ(-304deg) rotateY(7deg) translateX(305px) rotateZ(304deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-304deg) rotateY(7deg) translateX(915px) rotateZ(304deg); } }
.c {
  width: 16px;
  height: 16px; }

.c:nth-child(89) {
  animation: orbit89 14s infinite;
  animation-delay: 0.89s;
  background-color: rgba(255, 255, 255, 0.9);
  width: 16px;
  height: 16px; }

@keyframes orbit89 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-89deg) rotateY(5deg) translateX(342px) rotateZ(89deg); }
  80% {
    transform: rotateZ(-89deg) rotateY(5deg) translateX(342px) rotateZ(89deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-89deg) rotateY(5deg) translateX(1026px) rotateZ(89deg); } }
.c {
  width: 11px;
  height: 11px; }

.c:nth-child(90) {
  animation: orbit90 14s infinite;
  animation-delay: 0.9s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 11px;
  height: 11px; }

@keyframes orbit90 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-283deg) rotateY(5deg) translateX(315px) rotateZ(283deg); }
  80% {
    transform: rotateZ(-283deg) rotateY(5deg) translateX(315px) rotateZ(283deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-283deg) rotateY(5deg) translateX(945px) rotateZ(283deg); } }
.c {
  width: 8px;
  height: 8px; }

.c:nth-child(91) {
  animation: orbit91 14s infinite;
  animation-delay: 0.91s;
  background-color: rgba(255, 255, 255, 0.8);
  width: 8px;
  height: 8px; }

@keyframes orbit91 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-108deg) rotateY(9deg) translateX(307px) rotateZ(108deg); }
  80% {
    transform: rotateZ(-108deg) rotateY(9deg) translateX(307px) rotateZ(108deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-108deg) rotateY(9deg) translateX(921px) rotateZ(108deg); } }
.c {
  width: 30px;
  height: 30px; }

.c:nth-child(92) {
  animation: orbit92 14s infinite;
  animation-delay: 0.92s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 30px;
  height: 30px; }

@keyframes orbit92 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-56deg) rotateY(8deg) translateX(341px) rotateZ(56deg); }
  80% {
    transform: rotateZ(-56deg) rotateY(8deg) translateX(341px) rotateZ(56deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-56deg) rotateY(8deg) translateX(1023px) rotateZ(56deg); } }
.c {
  width: 9px;
  height: 9px; }

.c:nth-child(93) {
  animation: orbit93 14s infinite;
  animation-delay: 0.93s;
  background-color: rgba(255, 255, 255, 0.8);
  width: 9px;
  height: 9px; }

@keyframes orbit93 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-53deg) rotateY(1deg) translateX(348px) rotateZ(53deg); }
  80% {
    transform: rotateZ(-53deg) rotateY(1deg) translateX(348px) rotateZ(53deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-53deg) rotateY(1deg) translateX(1044px) rotateZ(53deg); } }
.c {
  width: 19px;
  height: 19px; }

.c:nth-child(94) {
  animation: orbit94 14s infinite;
  animation-delay: 0.94s;
  background-color: white;
  width: 19px;
  height: 19px; }

@keyframes orbit94 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-350deg) rotateY(9deg) translateX(350px) rotateZ(350deg); }
  80% {
    transform: rotateZ(-350deg) rotateY(9deg) translateX(350px) rotateZ(350deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-350deg) rotateY(9deg) translateX(1050px) rotateZ(350deg); } }
.c {
  width: 17px;
  height: 17px; }

.c:nth-child(95) {
  animation: orbit95 14s infinite;
  animation-delay: 0.95s;
  background-color: rgba(255, 255, 255, 0.8);
  width: 17px;
  height: 17px; }

@keyframes orbit95 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-123deg) rotateY(8deg) translateX(331px) rotateZ(123deg); }
  80% {
    transform: rotateZ(-123deg) rotateY(8deg) translateX(331px) rotateZ(123deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-123deg) rotateY(8deg) translateX(993px) rotateZ(123deg); } }
.c {
  width: 5px;
  height: 5px; }

.c:nth-child(96) {
  animation: orbit96 14s infinite;
  animation-delay: 0.96s;
  background-color: rgba(255, 255, 255, 0.2);
  width: 5px;
  height: 5px; }

@keyframes orbit96 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-157deg) rotateY(8deg) translateX(328px) rotateZ(157deg); }
  80% {
    transform: rotateZ(-157deg) rotateY(8deg) translateX(328px) rotateZ(157deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-157deg) rotateY(8deg) translateX(984px) rotateZ(157deg); } }
.c {
  width: 5px;
  height: 5px; }

.c:nth-child(97) {
  animation: orbit97 14s infinite;
  animation-delay: 0.97s;
  background-color: rgba(255, 255, 255, 0.5);
  width: 5px;
  height: 5px; }

@keyframes orbit97 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-223deg) rotateY(2deg) translateX(347px) rotateZ(223deg); }
  80% {
    transform: rotateZ(-223deg) rotateY(2deg) translateX(347px) rotateZ(223deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-223deg) rotateY(2deg) translateX(1041px) rotateZ(223deg); } }
.c {
  width: 26px;
  height: 26px; }

.c:nth-child(98) {
  animation: orbit98 14s infinite;
  animation-delay: 0.98s;
  background-color: rgba(255, 255, 255, 0.8);
  width: 26px;
  height: 26px; }

@keyframes orbit98 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-285deg) rotateY(7deg) translateX(306px) rotateZ(285deg); }
  80% {
    transform: rotateZ(-285deg) rotateY(7deg) translateX(306px) rotateZ(285deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-285deg) rotateY(7deg) translateX(918px) rotateZ(285deg); } }
.c {
  width: 15px;
  height: 15px; }

.c:nth-child(99) {
  animation: orbit99 14s infinite;
  animation-delay: 0.99s;
  background-color: rgba(255, 255, 255, 0.2);
  width: 15px;
  height: 15px; }

@keyframes orbit99 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-173deg) rotateY(2deg) translateX(343px) rotateZ(173deg); }
  80% {
    transform: rotateZ(-173deg) rotateY(2deg) translateX(343px) rotateZ(173deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-173deg) rotateY(2deg) translateX(1029px) rotateZ(173deg); } }
.c {
  width: 16px;
  height: 16px; }

.c:nth-child(100) {
  animation: orbit100 14s infinite;
  animation-delay: 1s;
  background-color: rgba(255, 255, 255, 0.2);
  width: 16px;
  height: 16px; }

@keyframes orbit100 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-288deg) rotateY(7deg) translateX(345px) rotateZ(288deg); }
  80% {
    transform: rotateZ(-288deg) rotateY(7deg) translateX(345px) rotateZ(288deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-288deg) rotateY(7deg) translateX(1035px) rotateZ(288deg); } }
.c {
  width: 15px;
  height: 15px; }

.c:nth-child(101) {
  animation: orbit101 14s infinite;
  animation-delay: 1.01s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 15px;
  height: 15px; }

@keyframes orbit101 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-355deg) rotateY(8deg) translateX(346px) rotateZ(355deg); }
  80% {
    transform: rotateZ(-355deg) rotateY(8deg) translateX(346px) rotateZ(355deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-355deg) rotateY(8deg) translateX(1038px) rotateZ(355deg); } }
.c {
  width: 7px;
  height: 7px; }

.c:nth-child(102) {
  animation: orbit102 14s infinite;
  animation-delay: 1.02s;
  background-color: rgba(255, 255, 255, 0.8);
  width: 7px;
  height: 7px; }

@keyframes orbit102 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-222deg) rotateY(9deg) translateX(310px) rotateZ(222deg); }
  80% {
    transform: rotateZ(-222deg) rotateY(9deg) translateX(310px) rotateZ(222deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-222deg) rotateY(9deg) translateX(930px) rotateZ(222deg); } }
.c {
  width: 30px;
  height: 30px; }

.c:nth-child(103) {
  animation: orbit103 14s infinite;
  animation-delay: 1.03s;
  background-color: white;
  width: 30px;
  height: 30px; }

@keyframes orbit103 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-300deg) rotateY(1deg) translateX(315px) rotateZ(300deg); }
  80% {
    transform: rotateZ(-300deg) rotateY(1deg) translateX(315px) rotateZ(300deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-300deg) rotateY(1deg) translateX(945px) rotateZ(300deg); } }
.c {
  width: 11px;
  height: 11px; }

.c:nth-child(104) {
  animation: orbit104 14s infinite;
  animation-delay: 1.04s;
  background-color: rgba(255, 255, 255, 0.5);
  width: 11px;
  height: 11px; }

@keyframes orbit104 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-69deg) rotateY(5deg) translateX(313px) rotateZ(69deg); }
  80% {
    transform: rotateZ(-69deg) rotateY(5deg) translateX(313px) rotateZ(69deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-69deg) rotateY(5deg) translateX(939px) rotateZ(69deg); } }
.c {
  width: 24px;
  height: 24px; }

.c:nth-child(105) {
  animation: orbit105 14s infinite;
  animation-delay: 1.05s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 24px;
  height: 24px; }

@keyframes orbit105 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-255deg) rotateY(9deg) translateX(337px) rotateZ(255deg); }
  80% {
    transform: rotateZ(-255deg) rotateY(9deg) translateX(337px) rotateZ(255deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-255deg) rotateY(9deg) translateX(1011px) rotateZ(255deg); } }
.c {
  width: 27px;
  height: 27px; }

.c:nth-child(106) {
  animation: orbit106 14s infinite;
  animation-delay: 1.06s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 27px;
  height: 27px; }

@keyframes orbit106 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-191deg) rotateY(7deg) translateX(308px) rotateZ(191deg); }
  80% {
    transform: rotateZ(-191deg) rotateY(7deg) translateX(308px) rotateZ(191deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-191deg) rotateY(7deg) translateX(924px) rotateZ(191deg); } }
.c {
  width: 6px;
  height: 6px; }

.c:nth-child(107) {
  animation: orbit107 14s infinite;
  animation-delay: 1.07s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 6px;
  height: 6px; }

@keyframes orbit107 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-143deg) rotateY(6deg) translateX(303px) rotateZ(143deg); }
  80% {
    transform: rotateZ(-143deg) rotateY(6deg) translateX(303px) rotateZ(143deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-143deg) rotateY(6deg) translateX(909px) rotateZ(143deg); } }
.c {
  width: 16px;
  height: 16px; }

.c:nth-child(108) {
  animation: orbit108 14s infinite;
  animation-delay: 1.08s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 16px;
  height: 16px; }

@keyframes orbit108 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-148deg) rotateY(8deg) translateX(349px) rotateZ(148deg); }
  80% {
    transform: rotateZ(-148deg) rotateY(8deg) translateX(349px) rotateZ(148deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-148deg) rotateY(8deg) translateX(1047px) rotateZ(148deg); } }
.c {
  width: 12px;
  height: 12px; }

.c:nth-child(109) {
  animation: orbit109 14s infinite;
  animation-delay: 1.09s;
  background-color: rgba(255, 255, 255, 0.5);
  width: 12px;
  height: 12px; }

@keyframes orbit109 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-214deg) rotateY(1deg) translateX(338px) rotateZ(214deg); }
  80% {
    transform: rotateZ(-214deg) rotateY(1deg) translateX(338px) rotateZ(214deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-214deg) rotateY(1deg) translateX(1014px) rotateZ(214deg); } }
.c {
  width: 23px;
  height: 23px; }

.c:nth-child(110) {
  animation: orbit110 14s infinite;
  animation-delay: 1.1s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 23px;
  height: 23px; }

@keyframes orbit110 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-5deg) rotateY(3deg) translateX(338px) rotateZ(5deg); }
  80% {
    transform: rotateZ(-5deg) rotateY(3deg) translateX(338px) rotateZ(5deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-5deg) rotateY(3deg) translateX(1014px) rotateZ(5deg); } }
.c {
  width: 13px;
  height: 13px; }

.c:nth-child(111) {
  animation: orbit111 14s infinite;
  animation-delay: 1.11s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 13px;
  height: 13px; }

@keyframes orbit111 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-257deg) rotateY(5deg) translateX(333px) rotateZ(257deg); }
  80% {
    transform: rotateZ(-257deg) rotateY(5deg) translateX(333px) rotateZ(257deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-257deg) rotateY(5deg) translateX(999px) rotateZ(257deg); } }
.c {
  width: 1px;
  height: 1px; }

.c:nth-child(112) {
  animation: orbit112 14s infinite;
  animation-delay: 1.12s;
  background-color: rgba(255, 255, 255, 0.4);
  width: 1px;
  height: 1px; }

@keyframes orbit112 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-95deg) rotateY(1deg) translateX(312px) rotateZ(95deg); }
  80% {
    transform: rotateZ(-95deg) rotateY(1deg) translateX(312px) rotateZ(95deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-95deg) rotateY(1deg) translateX(936px) rotateZ(95deg); } }
.c {
  width: 3px;
  height: 3px; }

.c:nth-child(113) {
  animation: orbit113 14s infinite;
  animation-delay: 1.13s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 3px;
  height: 3px; }

@keyframes orbit113 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-113deg) rotateY(3deg) translateX(331px) rotateZ(113deg); }
  80% {
    transform: rotateZ(-113deg) rotateY(3deg) translateX(331px) rotateZ(113deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-113deg) rotateY(3deg) translateX(993px) rotateZ(113deg); } }
.c {
  width: 25px;
  height: 25px; }

.c:nth-child(114) {
  animation: orbit114 14s infinite;
  animation-delay: 1.14s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 25px;
  height: 25px; }

@keyframes orbit114 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-218deg) rotateY(8deg) translateX(339px) rotateZ(218deg); }
  80% {
    transform: rotateZ(-218deg) rotateY(8deg) translateX(339px) rotateZ(218deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-218deg) rotateY(8deg) translateX(1017px) rotateZ(218deg); } }
.c {
  width: 24px;
  height: 24px; }

.c:nth-child(115) {
  animation: orbit115 14s infinite;
  animation-delay: 1.15s;
  background-color: rgba(255, 255, 255, 0.2);
  width: 24px;
  height: 24px; }

@keyframes orbit115 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-227deg) rotateY(5deg) translateX(319px) rotateZ(227deg); }
  80% {
    transform: rotateZ(-227deg) rotateY(5deg) translateX(319px) rotateZ(227deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-227deg) rotateY(5deg) translateX(957px) rotateZ(227deg); } }
.c {
  width: 24px;
  height: 24px; }

.c:nth-child(116) {
  animation: orbit116 14s infinite;
  animation-delay: 1.16s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 24px;
  height: 24px; }

@keyframes orbit116 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-56deg) rotateY(6deg) translateX(316px) rotateZ(56deg); }
  80% {
    transform: rotateZ(-56deg) rotateY(6deg) translateX(316px) rotateZ(56deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-56deg) rotateY(6deg) translateX(948px) rotateZ(56deg); } }
.c {
  width: 22px;
  height: 22px; }

.c:nth-child(117) {
  animation: orbit117 14s infinite;
  animation-delay: 1.17s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 22px;
  height: 22px; }

@keyframes orbit117 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-117deg) rotateY(6deg) translateX(343px) rotateZ(117deg); }
  80% {
    transform: rotateZ(-117deg) rotateY(6deg) translateX(343px) rotateZ(117deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-117deg) rotateY(6deg) translateX(1029px) rotateZ(117deg); } }
.c {
  width: 10px;
  height: 10px; }

.c:nth-child(118) {
  animation: orbit118 14s infinite;
  animation-delay: 1.18s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 10px;
  height: 10px; }

@keyframes orbit118 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-224deg) rotateY(7deg) translateX(327px) rotateZ(224deg); }
  80% {
    transform: rotateZ(-224deg) rotateY(7deg) translateX(327px) rotateZ(224deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-224deg) rotateY(7deg) translateX(981px) rotateZ(224deg); } }
.c {
  width: 23px;
  height: 23px; }

.c:nth-child(119) {
  animation: orbit119 14s infinite;
  animation-delay: 1.19s;
  background-color: rgba(255, 255, 255, 0.8);
  width: 23px;
  height: 23px; }

@keyframes orbit119 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-53deg) rotateY(3deg) translateX(336px) rotateZ(53deg); }
  80% {
    transform: rotateZ(-53deg) rotateY(3deg) translateX(336px) rotateZ(53deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-53deg) rotateY(3deg) translateX(1008px) rotateZ(53deg); } }
.c {
  width: 8px;
  height: 8px; }

.c:nth-child(120) {
  animation: orbit120 14s infinite;
  animation-delay: 1.2s;
  background-color: rgba(255, 255, 255, 0.2);
  width: 8px;
  height: 8px; }

@keyframes orbit120 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-307deg) rotateY(5deg) translateX(303px) rotateZ(307deg); }
  80% {
    transform: rotateZ(-307deg) rotateY(5deg) translateX(303px) rotateZ(307deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-307deg) rotateY(5deg) translateX(909px) rotateZ(307deg); } }
.c {
  width: 10px;
  height: 10px; }

.c:nth-child(121) {
  animation: orbit121 14s infinite;
  animation-delay: 1.21s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 10px;
  height: 10px; }

@keyframes orbit121 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-225deg) rotateY(7deg) translateX(342px) rotateZ(225deg); }
  80% {
    transform: rotateZ(-225deg) rotateY(7deg) translateX(342px) rotateZ(225deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-225deg) rotateY(7deg) translateX(1026px) rotateZ(225deg); } }
.c {
  width: 2px;
  height: 2px; }

.c:nth-child(122) {
  animation: orbit122 14s infinite;
  animation-delay: 1.22s;
  background-color: rgba(255, 255, 255, 0.9);
  width: 2px;
  height: 2px; }

@keyframes orbit122 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-352deg) rotateY(8deg) translateX(333px) rotateZ(352deg); }
  80% {
    transform: rotateZ(-352deg) rotateY(8deg) translateX(333px) rotateZ(352deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-352deg) rotateY(8deg) translateX(999px) rotateZ(352deg); } }
.c {
  width: 1px;
  height: 1px; }

.c:nth-child(123) {
  animation: orbit123 14s infinite;
  animation-delay: 1.23s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 1px;
  height: 1px; }

@keyframes orbit123 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-299deg) rotateY(4deg) translateX(314px) rotateZ(299deg); }
  80% {
    transform: rotateZ(-299deg) rotateY(4deg) translateX(314px) rotateZ(299deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-299deg) rotateY(4deg) translateX(942px) rotateZ(299deg); } }
.c {
  width: 17px;
  height: 17px; }

.c:nth-child(124) {
  animation: orbit124 14s infinite;
  animation-delay: 1.24s;
  background-color: rgba(255, 255, 255, 0.8);
  width: 17px;
  height: 17px; }

@keyframes orbit124 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-328deg) rotateY(4deg) translateX(342px) rotateZ(328deg); }
  80% {
    transform: rotateZ(-328deg) rotateY(4deg) translateX(342px) rotateZ(328deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-328deg) rotateY(4deg) translateX(1026px) rotateZ(328deg); } }
.c {
  width: 28px;
  height: 28px; }

.c:nth-child(125) {
  animation: orbit125 14s infinite;
  animation-delay: 1.25s;
  background-color: rgba(255, 255, 255, 0.2);
  width: 28px;
  height: 28px; }

@keyframes orbit125 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-128deg) rotateY(9deg) translateX(328px) rotateZ(128deg); }
  80% {
    transform: rotateZ(-128deg) rotateY(9deg) translateX(328px) rotateZ(128deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-128deg) rotateY(9deg) translateX(984px) rotateZ(128deg); } }
.c {
  width: 26px;
  height: 26px; }

.c:nth-child(126) {
  animation: orbit126 14s infinite;
  animation-delay: 1.26s;
  background-color: rgba(255, 255, 255, 0.8);
  width: 26px;
  height: 26px; }

@keyframes orbit126 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-21deg) rotateY(8deg) translateX(301px) rotateZ(21deg); }
  80% {
    transform: rotateZ(-21deg) rotateY(8deg) translateX(301px) rotateZ(21deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-21deg) rotateY(8deg) translateX(903px) rotateZ(21deg); } }
.c {
  width: 23px;
  height: 23px; }

.c:nth-child(127) {
  animation: orbit127 14s infinite;
  animation-delay: 1.27s;
  background-color: rgba(255, 255, 255, 0.5);
  width: 23px;
  height: 23px; }

@keyframes orbit127 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-184deg) rotateY(7deg) translateX(316px) rotateZ(184deg); }
  80% {
    transform: rotateZ(-184deg) rotateY(7deg) translateX(316px) rotateZ(184deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-184deg) rotateY(7deg) translateX(948px) rotateZ(184deg); } }
.c {
  width: 15px;
  height: 15px; }

.c:nth-child(128) {
  animation: orbit128 14s infinite;
  animation-delay: 1.28s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 15px;
  height: 15px; }

@keyframes orbit128 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-186deg) rotateY(7deg) translateX(338px) rotateZ(186deg); }
  80% {
    transform: rotateZ(-186deg) rotateY(7deg) translateX(338px) rotateZ(186deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-186deg) rotateY(7deg) translateX(1014px) rotateZ(186deg); } }
.c {
  width: 6px;
  height: 6px; }

.c:nth-child(129) {
  animation: orbit129 14s infinite;
  animation-delay: 1.29s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 6px;
  height: 6px; }

@keyframes orbit129 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-157deg) rotateY(6deg) translateX(344px) rotateZ(157deg); }
  80% {
    transform: rotateZ(-157deg) rotateY(6deg) translateX(344px) rotateZ(157deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-157deg) rotateY(6deg) translateX(1032px) rotateZ(157deg); } }
.c {
  width: 7px;
  height: 7px; }

.c:nth-child(130) {
  animation: orbit130 14s infinite;
  animation-delay: 1.3s;
  background-color: rgba(255, 255, 255, 0.5);
  width: 7px;
  height: 7px; }

@keyframes orbit130 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-341deg) rotateY(4deg) translateX(322px) rotateZ(341deg); }
  80% {
    transform: rotateZ(-341deg) rotateY(4deg) translateX(322px) rotateZ(341deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-341deg) rotateY(4deg) translateX(966px) rotateZ(341deg); } }
.c {
  width: 30px;
  height: 30px; }

.c:nth-child(131) {
  animation: orbit131 14s infinite;
  animation-delay: 1.31s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 30px;
  height: 30px; }

@keyframes orbit131 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-350deg) rotateY(3deg) translateX(323px) rotateZ(350deg); }
  80% {
    transform: rotateZ(-350deg) rotateY(3deg) translateX(323px) rotateZ(350deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-350deg) rotateY(3deg) translateX(969px) rotateZ(350deg); } }
.c {
  width: 4px;
  height: 4px; }

.c:nth-child(132) {
  animation: orbit132 14s infinite;
  animation-delay: 1.32s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 4px;
  height: 4px; }

@keyframes orbit132 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-292deg) rotateY(2deg) translateX(341px) rotateZ(292deg); }
  80% {
    transform: rotateZ(-292deg) rotateY(2deg) translateX(341px) rotateZ(292deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-292deg) rotateY(2deg) translateX(1023px) rotateZ(292deg); } }
.c {
  width: 17px;
  height: 17px; }

.c:nth-child(133) {
  animation: orbit133 14s infinite;
  animation-delay: 1.33s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 17px;
  height: 17px; }

@keyframes orbit133 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-71deg) rotateY(10deg) translateX(301px) rotateZ(71deg); }
  80% {
    transform: rotateZ(-71deg) rotateY(10deg) translateX(301px) rotateZ(71deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-71deg) rotateY(10deg) translateX(903px) rotateZ(71deg); } }
.c {
  width: 29px;
  height: 29px; }

.c:nth-child(134) {
  animation: orbit134 14s infinite;
  animation-delay: 1.34s;
  background-color: rgba(255, 255, 255, 0.8);
  width: 29px;
  height: 29px; }

@keyframes orbit134 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-177deg) rotateY(6deg) translateX(315px) rotateZ(177deg); }
  80% {
    transform: rotateZ(-177deg) rotateY(6deg) translateX(315px) rotateZ(177deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-177deg) rotateY(6deg) translateX(945px) rotateZ(177deg); } }
.c {
  width: 20px;
  height: 20px; }

.c:nth-child(135) {
  animation: orbit135 14s infinite;
  animation-delay: 1.35s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 20px;
  height: 20px; }

@keyframes orbit135 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-110deg) rotateY(6deg) translateX(324px) rotateZ(110deg); }
  80% {
    transform: rotateZ(-110deg) rotateY(6deg) translateX(324px) rotateZ(110deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-110deg) rotateY(6deg) translateX(972px) rotateZ(110deg); } }
.c {
  width: 15px;
  height: 15px; }

.c:nth-child(136) {
  animation: orbit136 14s infinite;
  animation-delay: 1.36s;
  background-color: rgba(255, 255, 255, 0.8);
  width: 15px;
  height: 15px; }

@keyframes orbit136 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-20deg) rotateY(5deg) translateX(340px) rotateZ(20deg); }
  80% {
    transform: rotateZ(-20deg) rotateY(5deg) translateX(340px) rotateZ(20deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-20deg) rotateY(5deg) translateX(1020px) rotateZ(20deg); } }
.c {
  width: 2px;
  height: 2px; }

.c:nth-child(137) {
  animation: orbit137 14s infinite;
  animation-delay: 1.37s;
  background-color: rgba(255, 255, 255, 0.8);
  width: 2px;
  height: 2px; }

@keyframes orbit137 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-127deg) rotateY(6deg) translateX(313px) rotateZ(127deg); }
  80% {
    transform: rotateZ(-127deg) rotateY(6deg) translateX(313px) rotateZ(127deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-127deg) rotateY(6deg) translateX(939px) rotateZ(127deg); } }
.c {
  width: 16px;
  height: 16px; }

.c:nth-child(138) {
  animation: orbit138 14s infinite;
  animation-delay: 1.38s;
  background-color: white;
  width: 16px;
  height: 16px; }

@keyframes orbit138 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-141deg) rotateY(10deg) translateX(304px) rotateZ(141deg); }
  80% {
    transform: rotateZ(-141deg) rotateY(10deg) translateX(304px) rotateZ(141deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-141deg) rotateY(10deg) translateX(912px) rotateZ(141deg); } }
.c {
  width: 30px;
  height: 30px; }

.c:nth-child(139) {
  animation: orbit139 14s infinite;
  animation-delay: 1.39s;
  background-color: rgba(255, 255, 255, 0.2);
  width: 30px;
  height: 30px; }

@keyframes orbit139 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-239deg) rotateY(6deg) translateX(349px) rotateZ(239deg); }
  80% {
    transform: rotateZ(-239deg) rotateY(6deg) translateX(349px) rotateZ(239deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-239deg) rotateY(6deg) translateX(1047px) rotateZ(239deg); } }
.c {
  width: 13px;
  height: 13px; }

.c:nth-child(140) {
  animation: orbit140 14s infinite;
  animation-delay: 1.4s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 13px;
  height: 13px; }

@keyframes orbit140 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-222deg) rotateY(10deg) translateX(319px) rotateZ(222deg); }
  80% {
    transform: rotateZ(-222deg) rotateY(10deg) translateX(319px) rotateZ(222deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-222deg) rotateY(10deg) translateX(957px) rotateZ(222deg); } }
.c {
  width: 25px;
  height: 25px; }

.c:nth-child(141) {
  animation: orbit141 14s infinite;
  animation-delay: 1.41s;
  background-color: rgba(255, 255, 255, 0.5);
  width: 25px;
  height: 25px; }

@keyframes orbit141 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-227deg) rotateY(1deg) translateX(331px) rotateZ(227deg); }
  80% {
    transform: rotateZ(-227deg) rotateY(1deg) translateX(331px) rotateZ(227deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-227deg) rotateY(1deg) translateX(993px) rotateZ(227deg); } }
.c {
  width: 1px;
  height: 1px; }

.c:nth-child(142) {
  animation: orbit142 14s infinite;
  animation-delay: 1.42s;
  background-color: rgba(255, 255, 255, 0.5);
  width: 1px;
  height: 1px; }

@keyframes orbit142 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-24deg) rotateY(7deg) translateX(339px) rotateZ(24deg); }
  80% {
    transform: rotateZ(-24deg) rotateY(7deg) translateX(339px) rotateZ(24deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-24deg) rotateY(7deg) translateX(1017px) rotateZ(24deg); } }
.c {
  width: 1px;
  height: 1px; }

.c:nth-child(143) {
  animation: orbit143 14s infinite;
  animation-delay: 1.43s;
  background-color: rgba(255, 255, 255, 0.9);
  width: 1px;
  height: 1px; }

@keyframes orbit143 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-167deg) rotateY(3deg) translateX(317px) rotateZ(167deg); }
  80% {
    transform: rotateZ(-167deg) rotateY(3deg) translateX(317px) rotateZ(167deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-167deg) rotateY(3deg) translateX(951px) rotateZ(167deg); } }
.c {
  width: 30px;
  height: 30px; }

.c:nth-child(144) {
  animation: orbit144 14s infinite;
  animation-delay: 1.44s;
  background-color: rgba(255, 255, 255, 0.9);
  width: 30px;
  height: 30px; }

@keyframes orbit144 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-10deg) rotateY(6deg) translateX(334px) rotateZ(10deg); }
  80% {
    transform: rotateZ(-10deg) rotateY(6deg) translateX(334px) rotateZ(10deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-10deg) rotateY(6deg) translateX(1002px) rotateZ(10deg); } }
.c {
  width: 9px;
  height: 9px; }

.c:nth-child(145) {
  animation: orbit145 14s infinite;
  animation-delay: 1.45s;
  background-color: rgba(255, 255, 255, 0.4);
  width: 9px;
  height: 9px; }

@keyframes orbit145 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-165deg) rotateY(8deg) translateX(342px) rotateZ(165deg); }
  80% {
    transform: rotateZ(-165deg) rotateY(8deg) translateX(342px) rotateZ(165deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-165deg) rotateY(8deg) translateX(1026px) rotateZ(165deg); } }
.c {
  width: 24px;
  height: 24px; }

.c:nth-child(146) {
  animation: orbit146 14s infinite;
  animation-delay: 1.46s;
  background-color: rgba(255, 255, 255, 0.6);
  width: 24px;
  height: 24px; }

@keyframes orbit146 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-203deg) rotateY(1deg) translateX(335px) rotateZ(203deg); }
  80% {
    transform: rotateZ(-203deg) rotateY(1deg) translateX(335px) rotateZ(203deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-203deg) rotateY(1deg) translateX(1005px) rotateZ(203deg); } }
.c {
  width: 24px;
  height: 24px; }

.c:nth-child(147) {
  animation: orbit147 14s infinite;
  animation-delay: 1.47s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 24px;
  height: 24px; }

@keyframes orbit147 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-113deg) rotateY(2deg) translateX(312px) rotateZ(113deg); }
  80% {
    transform: rotateZ(-113deg) rotateY(2deg) translateX(312px) rotateZ(113deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-113deg) rotateY(2deg) translateX(936px) rotateZ(113deg); } }
.c {
  width: 9px;
  height: 9px; }

.c:nth-child(148) {
  animation: orbit148 14s infinite;
  animation-delay: 1.48s;
  background-color: rgba(255, 255, 255, 0.5);
  width: 9px;
  height: 9px; }

@keyframes orbit148 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-178deg) rotateY(6deg) translateX(343px) rotateZ(178deg); }
  80% {
    transform: rotateZ(-178deg) rotateY(6deg) translateX(343px) rotateZ(178deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-178deg) rotateY(6deg) translateX(1029px) rotateZ(178deg); } }
.c {
  width: 17px;
  height: 17px; }

.c:nth-child(149) {
  animation: orbit149 14s infinite;
  animation-delay: 1.49s;
  background-color: rgba(255, 255, 255, 0.4);
  width: 17px;
  height: 17px; }

@keyframes orbit149 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-202deg) rotateY(4deg) translateX(319px) rotateZ(202deg); }
  80% {
    transform: rotateZ(-202deg) rotateY(4deg) translateX(319px) rotateZ(202deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-202deg) rotateY(4deg) translateX(957px) rotateZ(202deg); } }
.c {
  width: 29px;
  height: 29px; }

.c:nth-child(150) {
  animation: orbit150 14s infinite;
  animation-delay: 1.5s;
  background-color: white;
  width: 29px;
  height: 29px; }

@keyframes orbit150 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-263deg) rotateY(3deg) translateX(338px) rotateZ(263deg); }
  80% {
    transform: rotateZ(-263deg) rotateY(3deg) translateX(338px) rotateZ(263deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-263deg) rotateY(3deg) translateX(1014px) rotateZ(263deg); } }
.c {
  width: 15px;
  height: 15px; }

.c:nth-child(151) {
  animation: orbit151 14s infinite;
  animation-delay: 1.51s;
  background-color: rgba(255, 255, 255, 0.6);
  width: 15px;
  height: 15px; }

@keyframes orbit151 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-208deg) rotateY(3deg) translateX(333px) rotateZ(208deg); }
  80% {
    transform: rotateZ(-208deg) rotateY(3deg) translateX(333px) rotateZ(208deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-208deg) rotateY(3deg) translateX(999px) rotateZ(208deg); } }
.c {
  width: 27px;
  height: 27px; }

.c:nth-child(152) {
  animation: orbit152 14s infinite;
  animation-delay: 1.52s;
  background-color: rgba(255, 255, 255, 0.4);
  width: 27px;
  height: 27px; }

@keyframes orbit152 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-156deg) rotateY(4deg) translateX(306px) rotateZ(156deg); }
  80% {
    transform: rotateZ(-156deg) rotateY(4deg) translateX(306px) rotateZ(156deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-156deg) rotateY(4deg) translateX(918px) rotateZ(156deg); } }
.c {
  width: 18px;
  height: 18px; }

.c:nth-child(153) {
  animation: orbit153 14s infinite;
  animation-delay: 1.53s;
  background-color: white;
  width: 18px;
  height: 18px; }

@keyframes orbit153 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-159deg) rotateY(4deg) translateX(311px) rotateZ(159deg); }
  80% {
    transform: rotateZ(-159deg) rotateY(4deg) translateX(311px) rotateZ(159deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-159deg) rotateY(4deg) translateX(933px) rotateZ(159deg); } }
.c {
  width: 18px;
  height: 18px; }

.c:nth-child(154) {
  animation: orbit154 14s infinite;
  animation-delay: 1.54s;
  background-color: rgba(255, 255, 255, 0.5);
  width: 18px;
  height: 18px; }

@keyframes orbit154 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-233deg) rotateY(10deg) translateX(326px) rotateZ(233deg); }
  80% {
    transform: rotateZ(-233deg) rotateY(10deg) translateX(326px) rotateZ(233deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-233deg) rotateY(10deg) translateX(978px) rotateZ(233deg); } }
.c {
  width: 11px;
  height: 11px; }

.c:nth-child(155) {
  animation: orbit155 14s infinite;
  animation-delay: 1.55s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 11px;
  height: 11px; }

@keyframes orbit155 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-111deg) rotateY(9deg) translateX(347px) rotateZ(111deg); }
  80% {
    transform: rotateZ(-111deg) rotateY(9deg) translateX(347px) rotateZ(111deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-111deg) rotateY(9deg) translateX(1041px) rotateZ(111deg); } }
.c {
  width: 8px;
  height: 8px; }

.c:nth-child(156) {
  animation: orbit156 14s infinite;
  animation-delay: 1.56s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 8px;
  height: 8px; }

@keyframes orbit156 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-126deg) rotateY(8deg) translateX(319px) rotateZ(126deg); }
  80% {
    transform: rotateZ(-126deg) rotateY(8deg) translateX(319px) rotateZ(126deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-126deg) rotateY(8deg) translateX(957px) rotateZ(126deg); } }
.c {
  width: 22px;
  height: 22px; }

.c:nth-child(157) {
  animation: orbit157 14s infinite;
  animation-delay: 1.57s;
  background-color: rgba(255, 255, 255, 0.8);
  width: 22px;
  height: 22px; }

@keyframes orbit157 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-57deg) rotateY(2deg) translateX(348px) rotateZ(57deg); }
  80% {
    transform: rotateZ(-57deg) rotateY(2deg) translateX(348px) rotateZ(57deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-57deg) rotateY(2deg) translateX(1044px) rotateZ(57deg); } }
.c {
  width: 23px;
  height: 23px; }

.c:nth-child(158) {
  animation: orbit158 14s infinite;
  animation-delay: 1.58s;
  background-color: rgba(255, 255, 255, 0.4);
  width: 23px;
  height: 23px; }

@keyframes orbit158 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-214deg) rotateY(2deg) translateX(350px) rotateZ(214deg); }
  80% {
    transform: rotateZ(-214deg) rotateY(2deg) translateX(350px) rotateZ(214deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-214deg) rotateY(2deg) translateX(1050px) rotateZ(214deg); } }
.c {
  width: 16px;
  height: 16px; }

.c:nth-child(159) {
  animation: orbit159 14s infinite;
  animation-delay: 1.59s;
  background-color: rgba(255, 255, 255, 0.4);
  width: 16px;
  height: 16px; }

@keyframes orbit159 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-313deg) rotateY(2deg) translateX(326px) rotateZ(313deg); }
  80% {
    transform: rotateZ(-313deg) rotateY(2deg) translateX(326px) rotateZ(313deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-313deg) rotateY(2deg) translateX(978px) rotateZ(313deg); } }
.c {
  width: 26px;
  height: 26px; }

.c:nth-child(160) {
  animation: orbit160 14s infinite;
  animation-delay: 1.6s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 26px;
  height: 26px; }

@keyframes orbit160 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-25deg) rotateY(3deg) translateX(312px) rotateZ(25deg); }
  80% {
    transform: rotateZ(-25deg) rotateY(3deg) translateX(312px) rotateZ(25deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-25deg) rotateY(3deg) translateX(936px) rotateZ(25deg); } }
.c {
  width: 28px;
  height: 28px; }

.c:nth-child(161) {
  animation: orbit161 14s infinite;
  animation-delay: 1.61s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 28px;
  height: 28px; }

@keyframes orbit161 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-178deg) rotateY(9deg) translateX(334px) rotateZ(178deg); }
  80% {
    transform: rotateZ(-178deg) rotateY(9deg) translateX(334px) rotateZ(178deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-178deg) rotateY(9deg) translateX(1002px) rotateZ(178deg); } }
.c {
  width: 17px;
  height: 17px; }

.c:nth-child(162) {
  animation: orbit162 14s infinite;
  animation-delay: 1.62s;
  background-color: rgba(255, 255, 255, 0.6);
  width: 17px;
  height: 17px; }

@keyframes orbit162 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-328deg) rotateY(9deg) translateX(336px) rotateZ(328deg); }
  80% {
    transform: rotateZ(-328deg) rotateY(9deg) translateX(336px) rotateZ(328deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-328deg) rotateY(9deg) translateX(1008px) rotateZ(328deg); } }
.c {
  width: 28px;
  height: 28px; }

.c:nth-child(163) {
  animation: orbit163 14s infinite;
  animation-delay: 1.63s;
  background-color: rgba(255, 255, 255, 0.2);
  width: 28px;
  height: 28px; }

@keyframes orbit163 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-100deg) rotateY(2deg) translateX(329px) rotateZ(100deg); }
  80% {
    transform: rotateZ(-100deg) rotateY(2deg) translateX(329px) rotateZ(100deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-100deg) rotateY(2deg) translateX(987px) rotateZ(100deg); } }
.c {
  width: 14px;
  height: 14px; }

.c:nth-child(164) {
  animation: orbit164 14s infinite;
  animation-delay: 1.64s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 14px;
  height: 14px; }

@keyframes orbit164 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-63deg) rotateY(4deg) translateX(301px) rotateZ(63deg); }
  80% {
    transform: rotateZ(-63deg) rotateY(4deg) translateX(301px) rotateZ(63deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-63deg) rotateY(4deg) translateX(903px) rotateZ(63deg); } }
.c {
  width: 8px;
  height: 8px; }

.c:nth-child(165) {
  animation: orbit165 14s infinite;
  animation-delay: 1.65s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 8px;
  height: 8px; }

@keyframes orbit165 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-51deg) rotateY(5deg) translateX(349px) rotateZ(51deg); }
  80% {
    transform: rotateZ(-51deg) rotateY(5deg) translateX(349px) rotateZ(51deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-51deg) rotateY(5deg) translateX(1047px) rotateZ(51deg); } }
.c {
  width: 17px;
  height: 17px; }

.c:nth-child(166) {
  animation: orbit166 14s infinite;
  animation-delay: 1.66s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 17px;
  height: 17px; }

@keyframes orbit166 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-256deg) rotateY(6deg) translateX(311px) rotateZ(256deg); }
  80% {
    transform: rotateZ(-256deg) rotateY(6deg) translateX(311px) rotateZ(256deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-256deg) rotateY(6deg) translateX(933px) rotateZ(256deg); } }
.c {
  width: 16px;
  height: 16px; }

.c:nth-child(167) {
  animation: orbit167 14s infinite;
  animation-delay: 1.67s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 16px;
  height: 16px; }

@keyframes orbit167 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-255deg) rotateY(6deg) translateX(327px) rotateZ(255deg); }
  80% {
    transform: rotateZ(-255deg) rotateY(6deg) translateX(327px) rotateZ(255deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-255deg) rotateY(6deg) translateX(981px) rotateZ(255deg); } }
.c {
  width: 8px;
  height: 8px; }

.c:nth-child(168) {
  animation: orbit168 14s infinite;
  animation-delay: 1.68s;
  background-color: rgba(255, 255, 255, 0.9);
  width: 8px;
  height: 8px; }

@keyframes orbit168 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-13deg) rotateY(2deg) translateX(305px) rotateZ(13deg); }
  80% {
    transform: rotateZ(-13deg) rotateY(2deg) translateX(305px) rotateZ(13deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-13deg) rotateY(2deg) translateX(915px) rotateZ(13deg); } }
.c {
  width: 13px;
  height: 13px; }

.c:nth-child(169) {
  animation: orbit169 14s infinite;
  animation-delay: 1.69s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 13px;
  height: 13px; }

@keyframes orbit169 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-19deg) rotateY(8deg) translateX(317px) rotateZ(19deg); }
  80% {
    transform: rotateZ(-19deg) rotateY(8deg) translateX(317px) rotateZ(19deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-19deg) rotateY(8deg) translateX(951px) rotateZ(19deg); } }
.c {
  width: 1px;
  height: 1px; }

.c:nth-child(170) {
  animation: orbit170 14s infinite;
  animation-delay: 1.7s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 1px;
  height: 1px; }

@keyframes orbit170 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-117deg) rotateY(9deg) translateX(348px) rotateZ(117deg); }
  80% {
    transform: rotateZ(-117deg) rotateY(9deg) translateX(348px) rotateZ(117deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-117deg) rotateY(9deg) translateX(1044px) rotateZ(117deg); } }
.c {
  width: 24px;
  height: 24px; }

.c:nth-child(171) {
  animation: orbit171 14s infinite;
  animation-delay: 1.71s;
  background-color: rgba(255, 255, 255, 0.2);
  width: 24px;
  height: 24px; }

@keyframes orbit171 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-184deg) rotateY(6deg) translateX(307px) rotateZ(184deg); }
  80% {
    transform: rotateZ(-184deg) rotateY(6deg) translateX(307px) rotateZ(184deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-184deg) rotateY(6deg) translateX(921px) rotateZ(184deg); } }
.c {
  width: 4px;
  height: 4px; }

.c:nth-child(172) {
  animation: orbit172 14s infinite;
  animation-delay: 1.72s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 4px;
  height: 4px; }

@keyframes orbit172 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-355deg) rotateY(7deg) translateX(334px) rotateZ(355deg); }
  80% {
    transform: rotateZ(-355deg) rotateY(7deg) translateX(334px) rotateZ(355deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-355deg) rotateY(7deg) translateX(1002px) rotateZ(355deg); } }
.c {
  width: 14px;
  height: 14px; }

.c:nth-child(173) {
  animation: orbit173 14s infinite;
  animation-delay: 1.73s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 14px;
  height: 14px; }

@keyframes orbit173 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-25deg) rotateY(5deg) translateX(339px) rotateZ(25deg); }
  80% {
    transform: rotateZ(-25deg) rotateY(5deg) translateX(339px) rotateZ(25deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-25deg) rotateY(5deg) translateX(1017px) rotateZ(25deg); } }
.c {
  width: 18px;
  height: 18px; }

.c:nth-child(174) {
  animation: orbit174 14s infinite;
  animation-delay: 1.74s;
  background-color: rgba(255, 255, 255, 0.9);
  width: 18px;
  height: 18px; }

@keyframes orbit174 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-109deg) rotateY(7deg) translateX(313px) rotateZ(109deg); }
  80% {
    transform: rotateZ(-109deg) rotateY(7deg) translateX(313px) rotateZ(109deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-109deg) rotateY(7deg) translateX(939px) rotateZ(109deg); } }
.c {
  width: 22px;
  height: 22px; }

.c:nth-child(175) {
  animation: orbit175 14s infinite;
  animation-delay: 1.75s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 22px;
  height: 22px; }

@keyframes orbit175 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-42deg) rotateY(5deg) translateX(326px) rotateZ(42deg); }
  80% {
    transform: rotateZ(-42deg) rotateY(5deg) translateX(326px) rotateZ(42deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-42deg) rotateY(5deg) translateX(978px) rotateZ(42deg); } }
.c {
  width: 2px;
  height: 2px; }

.c:nth-child(176) {
  animation: orbit176 14s infinite;
  animation-delay: 1.76s;
  background-color: white;
  width: 2px;
  height: 2px; }

@keyframes orbit176 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-224deg) rotateY(8deg) translateX(325px) rotateZ(224deg); }
  80% {
    transform: rotateZ(-224deg) rotateY(8deg) translateX(325px) rotateZ(224deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-224deg) rotateY(8deg) translateX(975px) rotateZ(224deg); } }
.c {
  width: 9px;
  height: 9px; }

.c:nth-child(177) {
  animation: orbit177 14s infinite;
  animation-delay: 1.77s;
  background-color: rgba(255, 255, 255, 0.3);
  width: 9px;
  height: 9px; }

@keyframes orbit177 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-116deg) rotateY(9deg) translateX(348px) rotateZ(116deg); }
  80% {
    transform: rotateZ(-116deg) rotateY(9deg) translateX(348px) rotateZ(116deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-116deg) rotateY(9deg) translateX(1044px) rotateZ(116deg); } }
.c {
  width: 11px;
  height: 11px; }

.c:nth-child(178) {
  animation: orbit178 14s infinite;
  animation-delay: 1.78s;
  background-color: rgba(255, 255, 255, 0.8);
  width: 11px;
  height: 11px; }

@keyframes orbit178 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-27deg) rotateY(10deg) translateX(335px) rotateZ(27deg); }
  80% {
    transform: rotateZ(-27deg) rotateY(10deg) translateX(335px) rotateZ(27deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-27deg) rotateY(10deg) translateX(1005px) rotateZ(27deg); } }
.c {
  width: 30px;
  height: 30px; }

.c:nth-child(179) {
  animation: orbit179 14s infinite;
  animation-delay: 1.79s;
  background-color: rgba(255, 255, 255, 0.5);
  width: 30px;
  height: 30px; }

@keyframes orbit179 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-66deg) rotateY(6deg) translateX(305px) rotateZ(66deg); }
  80% {
    transform: rotateZ(-66deg) rotateY(6deg) translateX(305px) rotateZ(66deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-66deg) rotateY(6deg) translateX(915px) rotateZ(66deg); } }
.c {
  width: 8px;
  height: 8px; }

.c:nth-child(180) {
  animation: orbit180 14s infinite;
  animation-delay: 1.8s;
  background-color: white;
  width: 8px;
  height: 8px; }

@keyframes orbit180 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-54deg) rotateY(8deg) translateX(317px) rotateZ(54deg); }
  80% {
    transform: rotateZ(-54deg) rotateY(8deg) translateX(317px) rotateZ(54deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-54deg) rotateY(8deg) translateX(951px) rotateZ(54deg); } }
.c {
  width: 9px;
  height: 9px; }

.c:nth-child(181) {
  animation: orbit181 14s infinite;
  animation-delay: 1.81s;
  background-color: rgba(255, 255, 255, 0.5);
  width: 9px;
  height: 9px; }

@keyframes orbit181 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-344deg) rotateY(10deg) translateX(334px) rotateZ(344deg); }
  80% {
    transform: rotateZ(-344deg) rotateY(10deg) translateX(334px) rotateZ(344deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-344deg) rotateY(10deg) translateX(1002px) rotateZ(344deg); } }
.c {
  width: 5px;
  height: 5px; }

.c:nth-child(182) {
  animation: orbit182 14s infinite;
  animation-delay: 1.82s;
  background-color: rgba(255, 255, 255, 0.5);
  width: 5px;
  height: 5px; }

@keyframes orbit182 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-232deg) rotateY(2deg) translateX(319px) rotateZ(232deg); }
  80% {
    transform: rotateZ(-232deg) rotateY(2deg) translateX(319px) rotateZ(232deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-232deg) rotateY(2deg) translateX(957px) rotateZ(232deg); } }
.c {
  width: 27px;
  height: 27px; }

.c:nth-child(183) {
  animation: orbit183 14s infinite;
  animation-delay: 1.83s;
  background-color: rgba(255, 255, 255, 0.6);
  width: 27px;
  height: 27px; }

@keyframes orbit183 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-39deg) rotateY(7deg) translateX(313px) rotateZ(39deg); }
  80% {
    transform: rotateZ(-39deg) rotateY(7deg) translateX(313px) rotateZ(39deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-39deg) rotateY(7deg) translateX(939px) rotateZ(39deg); } }
.c {
  width: 5px;
  height: 5px; }

.c:nth-child(184) {
  animation: orbit184 14s infinite;
  animation-delay: 1.84s;
  background-color: rgba(255, 255, 255, 0.5);
  width: 5px;
  height: 5px; }

@keyframes orbit184 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-79deg) rotateY(3deg) translateX(341px) rotateZ(79deg); }
  80% {
    transform: rotateZ(-79deg) rotateY(3deg) translateX(341px) rotateZ(79deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-79deg) rotateY(3deg) translateX(1023px) rotateZ(79deg); } }
.c {
  width: 18px;
  height: 18px; }

.c:nth-child(185) {
  animation: orbit185 14s infinite;
  animation-delay: 1.85s;
  background-color: rgba(255, 255, 255, 0.4);
  width: 18px;
  height: 18px; }

@keyframes orbit185 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-201deg) rotateY(5deg) translateX(301px) rotateZ(201deg); }
  80% {
    transform: rotateZ(-201deg) rotateY(5deg) translateX(301px) rotateZ(201deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-201deg) rotateY(5deg) translateX(903px) rotateZ(201deg); } }
.c {
  width: 8px;
  height: 8px; }

.c:nth-child(186) {
  animation: orbit186 14s infinite;
  animation-delay: 1.86s;
  background-color: rgba(255, 255, 255, 0.5);
  width: 8px;
  height: 8px; }

@keyframes orbit186 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-189deg) rotateY(5deg) translateX(316px) rotateZ(189deg); }
  80% {
    transform: rotateZ(-189deg) rotateY(5deg) translateX(316px) rotateZ(189deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-189deg) rotateY(5deg) translateX(948px) rotateZ(189deg); } }
.c {
  width: 28px;
  height: 28px; }

.c:nth-child(187) {
  animation: orbit187 14s infinite;
  animation-delay: 1.87s;
  background-color: rgba(255, 255, 255, 0.5);
  width: 28px;
  height: 28px; }

@keyframes orbit187 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-233deg) rotateY(5deg) translateX(336px) rotateZ(233deg); }
  80% {
    transform: rotateZ(-233deg) rotateY(5deg) translateX(336px) rotateZ(233deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-233deg) rotateY(5deg) translateX(1008px) rotateZ(233deg); } }
.c {
  width: 9px;
  height: 9px; }

.c:nth-child(188) {
  animation: orbit188 14s infinite;
  animation-delay: 1.88s;
  background-color: rgba(255, 255, 255, 0.4);
  width: 9px;
  height: 9px; }

@keyframes orbit188 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-158deg) rotateY(7deg) translateX(326px) rotateZ(158deg); }
  80% {
    transform: rotateZ(-158deg) rotateY(7deg) translateX(326px) rotateZ(158deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-158deg) rotateY(7deg) translateX(978px) rotateZ(158deg); } }
.c {
  width: 7px;
  height: 7px; }

.c:nth-child(189) {
  animation: orbit189 14s infinite;
  animation-delay: 1.89s;
  background-color: rgba(255, 255, 255, 0.2);
  width: 7px;
  height: 7px; }

@keyframes orbit189 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-352deg) rotateY(9deg) translateX(326px) rotateZ(352deg); }
  80% {
    transform: rotateZ(-352deg) rotateY(9deg) translateX(326px) rotateZ(352deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-352deg) rotateY(9deg) translateX(978px) rotateZ(352deg); } }
.c {
  width: 7px;
  height: 7px; }

.c:nth-child(190) {
  animation: orbit190 14s infinite;
  animation-delay: 1.9s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 7px;
  height: 7px; }

@keyframes orbit190 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-294deg) rotateY(4deg) translateX(324px) rotateZ(294deg); }
  80% {
    transform: rotateZ(-294deg) rotateY(4deg) translateX(324px) rotateZ(294deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-294deg) rotateY(4deg) translateX(972px) rotateZ(294deg); } }
.c {
  width: 5px;
  height: 5px; }

.c:nth-child(191) {
  animation: orbit191 14s infinite;
  animation-delay: 1.91s;
  background-color: rgba(255, 255, 255, 0.4);
  width: 5px;
  height: 5px; }

@keyframes orbit191 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-9deg) rotateY(5deg) translateX(306px) rotateZ(9deg); }
  80% {
    transform: rotateZ(-9deg) rotateY(5deg) translateX(306px) rotateZ(9deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-9deg) rotateY(5deg) translateX(918px) rotateZ(9deg); } }
.c {
  width: 15px;
  height: 15px; }

.c:nth-child(192) {
  animation: orbit192 14s infinite;
  animation-delay: 1.92s;
  background-color: rgba(255, 255, 255, 0.7);
  width: 15px;
  height: 15px; }

@keyframes orbit192 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-298deg) rotateY(7deg) translateX(321px) rotateZ(298deg); }
  80% {
    transform: rotateZ(-298deg) rotateY(7deg) translateX(321px) rotateZ(298deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-298deg) rotateY(7deg) translateX(963px) rotateZ(298deg); } }
.c {
  width: 6px;
  height: 6px; }

.c:nth-child(193) {
  animation: orbit193 14s infinite;
  animation-delay: 1.93s;
  background-color: rgba(255, 255, 255, 0.9);
  width: 6px;
  height: 6px; }

@keyframes orbit193 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-114deg) rotateY(6deg) translateX(326px) rotateZ(114deg); }
  80% {
    transform: rotateZ(-114deg) rotateY(6deg) translateX(326px) rotateZ(114deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-114deg) rotateY(6deg) translateX(978px) rotateZ(114deg); } }
.c {
  width: 11px;
  height: 11px; }

.c:nth-child(194) {
  animation: orbit194 14s infinite;
  animation-delay: 1.94s;
  background-color: rgba(255, 255, 255, 0.4);
  width: 11px;
  height: 11px; }

@keyframes orbit194 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-41deg) rotateY(6deg) translateX(348px) rotateZ(41deg); }
  80% {
    transform: rotateZ(-41deg) rotateY(6deg) translateX(348px) rotateZ(41deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-41deg) rotateY(6deg) translateX(1044px) rotateZ(41deg); } }
.c {
  width: 12px;
  height: 12px; }

.c:nth-child(195) {
  animation: orbit195 14s infinite;
  animation-delay: 1.95s;
  background-color: rgba(255, 255, 255, 0.1);
  width: 12px;
  height: 12px; }

@keyframes orbit195 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-266deg) rotateY(8deg) translateX(350px) rotateZ(266deg); }
  80% {
    transform: rotateZ(-266deg) rotateY(8deg) translateX(350px) rotateZ(266deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-266deg) rotateY(8deg) translateX(1050px) rotateZ(266deg); } }
.c {
  width: 20px;
  height: 20px; }

.c:nth-child(196) {
  animation: orbit196 14s infinite;
  animation-delay: 1.96s;
  background-color: rgba(255, 255, 255, 0.2);
  width: 20px;
  height: 20px; }

@keyframes orbit196 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-334deg) rotateY(6deg) translateX(330px) rotateZ(334deg); }
  80% {
    transform: rotateZ(-334deg) rotateY(6deg) translateX(330px) rotateZ(334deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-334deg) rotateY(6deg) translateX(990px) rotateZ(334deg); } }
.c {
  width: 28px;
  height: 28px; }

.c:nth-child(197) {
  animation: orbit197 14s infinite;
  animation-delay: 1.97s;
  background-color: rgba(255, 255, 255, 0.2);
  width: 28px;
  height: 28px; }

@keyframes orbit197 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-291deg) rotateY(4deg) translateX(341px) rotateZ(291deg); }
  80% {
    transform: rotateZ(-291deg) rotateY(4deg) translateX(341px) rotateZ(291deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-291deg) rotateY(4deg) translateX(1023px) rotateZ(291deg); } }
.c {
  width: 19px;
  height: 19px; }

.c:nth-child(198) {
  animation: orbit198 14s infinite;
  animation-delay: 1.98s;
  background-color: rgba(255, 255, 255, 0.5);
  width: 19px;
  height: 19px; }

@keyframes orbit198 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-64deg) rotateY(7deg) translateX(331px) rotateZ(64deg); }
  80% {
    transform: rotateZ(-64deg) rotateY(7deg) translateX(331px) rotateZ(64deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-64deg) rotateY(7deg) translateX(993px) rotateZ(64deg); } }
.c {
  width: 12px;
  height: 12px; }

.c:nth-child(199) {
  animation: orbit199 14s infinite;
  animation-delay: 1.99s;
  background-color: rgba(255, 255, 255, 0.9);
  width: 12px;
  height: 12px; }

@keyframes orbit199 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-290deg) rotateY(3deg) translateX(316px) rotateZ(290deg); }
  80% {
    transform: rotateZ(-290deg) rotateY(3deg) translateX(316px) rotateZ(290deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-290deg) rotateY(3deg) translateX(948px) rotateZ(290deg); } }
.c {
  width: 26px;
  height: 26px; }

.c:nth-child(200) {
  animation: orbit200 14s infinite;
  animation-delay: 2s;
  background-color: rgba(255, 255, 255, 0.6);
  width: 26px;
  height: 26px; }

@keyframes orbit200 {
  20% {
    opacity: 1; }
  30% {
    transform: rotateZ(-2deg) rotateY(5deg) translateX(332px) rotateZ(2deg); }
  80% {
    transform: rotateZ(-2deg) rotateY(5deg) translateX(332px) rotateZ(2deg);
    opacity: 1; }
  100% {
    transform: rotateZ(-2deg) rotateY(5deg) translateX(996px) rotateZ(2deg); } }
/*========= レイアウトのためのCSS ===============*/
.wrapper {
  overflow: hidden; }

.flex {
  display: flex;
  flex-wrap: wrap; }

.box {
  width: 220px;
  padding: 20px;
  margin: 0 20px 20px 0;
  background: #666;
  color: #fff;
  box-sizing: border-box; }

.bgextend,
.lineTrigger {
  width: 220px;
  padding: 20px;
  margin: 0 20px 20px 0;
  box-sizing: border-box; }

/*==================================================
ふわっ
===================================*/
/* fadeIn */
.fadeIn {
  animation-name: fadeInAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes fadeInAnime {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }
/* fadeUp */
.fadeUp {
  animation-name: fadeUpAnime;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes fadeUpAnime {
  from {
    opacity: 0;
    transform: translateY(100px); }
  to {
    opacity: 1;
    transform: translateY(0); } }
/* fadeDown */
.fadeDown {
  animation-name: fadeDownAnime;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes fadeDownAnime {
  from {
    opacity: 0;
    transform: translateY(-100px); }
  to {
    opacity: 1;
    transform: translateY(0); } }
/* fadeLeft */
.fadeLeft {
  animation-name: fadeLeftAnime;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes fadeLeftAnime {
  from {
    opacity: 0;
    transform: translateX(-100px); }
  to {
    opacity: 1;
    transform: translateX(0); } }
/* fadeRight */
.fadeRight {
  animation-name: fadeRightAnime;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes fadeRightAnime {
  from {
    opacity: 0;
    transform: translateX(100px); }
  to {
    opacity: 1;
    transform: translateX(0); } }
/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
.fadeInTrigger,
.fadeUpTrigger,
.fadeDownTrigger,
.fadeLeftTrigger,
.fadeRightTrigger {
  opacity: 0; }

/*==================================================
ぱたっ
===================================*/
/* flipDown */
.flipDown {
  animation-name: flipDownAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes flipDownAnime {
  from {
    transform: perspective(2500px) rotateX(100deg);
    opacity: 0; }
  to {
    transform: perspective(2500px) rotateX(0);
    opacity: 1; } }
/* flipLeft */
.flipLeft {
  animation-name: flipLeftAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  perspective-origin: left center;
  opacity: 0; }

@keyframes flipLeftAnime {
  from {
    transform: perspective(600px) translate3d(0, 0, 0) rotateY(30deg);
    opacity: 0; }
  to {
    transform: perspective(600px) translate3d(0, 0, 0) rotateY(0deg);
    opacity: 1; } }
/* flipLeftTop */
.flipLeftTop {
  animation-name: flipLeftTopAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes flipLeftTopAnime {
  from {
    transform: translate(-20px, 80px) rotate(-15deg);
    opacity: 0; }
  to {
    transform: translate(0, 0) rotate(0deg);
    opacity: 1; } }
/* flipRight */
.flipRight {
  animation-name: flipRightAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  perspective-origin: right center;
  opacity: 0; }

@keyframes flipRightAnime {
  from {
    transform: perspective(600px) translate3d(0, 0, 0) rotateY(-30deg);
    opacity: 0; }
  to {
    transform: perspective(600px) translate3d(0, 0, 0) rotateY(0deg);
    opacity: 1; } }
/* flipRightTop */
.flipRightTop {
  animation-name: flipRightTopAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes flipRightTopAnime {
  from {
    transform: translate(-20px, 80px) rotate(25deg);
    opacity: 0; }
  to {
    transform: translate(0, 1) rotate(0deg);
    opacity: 1; } }
/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
.flipDownTrigger,
.flipLeftTrigger,
.flipLeftTopTrigger,
.flipRightTrigger,
.flipRightTopTrigger {
  opacity: 0; }

/*==================================================
くるっ
===================================*/
/* rotateX */
.rotateX {
  animation-name: rotateXAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards; }

@keyframes rotateXAnime {
  from {
    transform: rotateX(0);
    opacity: 0; }
  to {
    transform: rotateX(-360deg);
    opacity: 1; } }
/* rotateY */
.rotateY {
  animation-name: rotateYAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards; }

@keyframes rotateYAnime {
  from {
    transform: rotateY(0);
    opacity: 0; }
  to {
    transform: rotateY(-360deg);
    opacity: 1; } }
/* rotateLeftZ */
.rotateLeftZ {
  animation-name: rotateLeftZAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards; }

@keyframes rotateLeftZAnime {
  from {
    transform: rotateZ(0);
    opacity: 0; }
  to {
    transform: rotateZ(-360deg);
    opacity: 1; } }
/* rotateRightZ */
.rotateRightZ {
  animation-name: rotateRightZAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards; }

@keyframes rotateRightZAnime {
  from {
    transform: rotateZ(0);
    opacity: 0; }
  to {
    transform: rotateZ(360deg);
    opacity: 1; } }
/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
.rotateXTrigger,
.rotateYTrigger,
.rotateLeftZTrigger,
.rotateRightZTrigger {
  opacity: 0; }

/*==================================================
ぶわっ、ぽんっ、どどんっ
===================================*/
/* zoomIn */
.zoomIn {
  animation-name: zoomInAnime;
  animation-duration: 0.5s;
  animation-fill-mode: forwards; }

@keyframes zoomInAnime {
  from {
    transform: scale(0.6);
    opacity: 0; }
  to {
    transform: scale(1);
    opacity: 1; } }
/* zoomOut */
.zoomOut {
  animation-name: zoomOutAnime;
  animation-duration: 0.5s;
  animation-fill-mode: forwards; }

@keyframes zoomOutAnime {
  from {
    transform: scale(1.2);
    opacity: 0; }
  to {
    transform: scale(1);
    opacity: 1; } }
/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
.zoomInTrigger,
.zoomOutTrigger {
  opacity: 0; }

/*==================================================
じわっ
===================================*/
/* blur */
.blur {
  animation-name: blurAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards; }

@keyframes blurAnime {
  from {
    filter: blur(10px);
    transform: scale(1.02);
    opacity: 0; }
  to {
    filter: blur(0);
    transform: scale(1);
    opacity: 1; } }
/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
.blurTrigger {
  opacity: 0; }

/*==================================================
にょろっ
===================================*/
/* smooth */
.smooth {
  animation-name: smoothAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  transform-origin: left;
  opacity: 0; }

@keyframes smoothAnime {
  from {
    transform: translate3d(0, 100%, 0) skewY(12deg);
    opacity: 0; }
  to {
    transform: translate3d(0, 0, 0) skewY(0);
    opacity: 1; } }
/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
.smoothTrigger {
  opacity: 0; }

/*==================================================
背景色が伸びて出現
===================================*/
.bgextend {
  animation-name: bgextendAnimeBase;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  position: relative;
  overflow: hidden;
  /*　はみ出た色要素を隠す　*/
  opacity: 0; }

@keyframes bgextendAnimeBase {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }
/*中の要素*/
.bgappear {
  animation-name: bgextendAnimeSecond;
  animation-duration: 1s;
  animation-delay: 0.6s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes bgextendAnimeSecond {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
/*左から右*/
.bgLRextend::before {
  animation-name: bgLRextendAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #666;
  /*伸びる背景色の設定*/ }

@keyframes bgLRextendAnime {
  0% {
    transform-origin: left;
    transform: scaleX(0); }
  50% {
    transform-origin: left;
    transform: scaleX(1); }
  50.001% {
    transform-origin: right; }
  100% {
    transform-origin: right;
    transform: scaleX(0); } }
/*右から左*/
.bgRLextend::before {
  animation-name: bgRLextendAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #666;
  /*伸びる背景色の設定*/ }

@keyframes bgRLextendAnime {
  0% {
    transform-origin: right;
    transform: scaleX(0); }
  50% {
    transform-origin: right;
    transform: scaleX(1); }
  50.001% {
    transform-origin: left; }
  100% {
    transform-origin: left;
    transform: scaleX(0); } }
/*下から上*/
.bgDUextend::before {
  animation-name: bgDUextendAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #666;
  /*伸びる背景色の設定*/ }

@keyframes bgDUextendAnime {
  0% {
    transform-origin: bottom;
    transform: scaleY(0); }
  50% {
    transform-origin: bottom;
    transform: scaleY(1); }
  50.001% {
    transform-origin: top; }
  100% {
    transform-origin: top;
    transform: scaleY(0); } }
/*上から下*/
.bgUDextend::before {
  animation-name: bgUDextendAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #666;
  /*伸びる背景色の設定*/ }

@keyframes bgUDextendAnime {
  0% {
    transform-origin: top;
    transform: scaleY(0); }
  50% {
    transform-origin: top;
    transform: scaleY(1); }
  50.001% {
    transform-origin: bottom; }
  100% {
    transform-origin: bottom;
    transform: scaleY(0); } }
/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
.bgappearTrigger,
.bgUDextendTrigger,
.bgDUextendTrigger,
.bgRLextendTrigger,
.bgLRextendTrigger {
  opacity: 0; }

/*==================================================
枠線が伸びて出現
===================================*/
/*枠線が伸びて出現*/
.lineTrigger {
  position: relative;
  /* 枠線が書かれる基点*/
  opacity: 0; }

.lineTrigger.lineanime {
  animation-name: lineAnimeBase;
  animation-duration: 1s;
  animation-fill-mode: forwards; }

@keyframes lineAnimeBase {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }
/*上下線*/
.lineTrigger::before,
.lineTrigger::after {
  position: absolute;
  content: '';
  width: 0;
  height: 1px;
  background: #333;
  /* 枠線の色*/ }

/*左右線*/
.line2::before,
.line2::after {
  position: absolute;
  content: '';
  width: 1px;
  height: 0;
  background: #333;
  /* 枠線の色*/ }

/*上線*/
.lineTrigger::before {
  top: 0;
  left: 0; }

.lineTrigger.lineanime::before {
  animation: lineAnime .5s linear 0s forwards;
  /*表示されて0秒後に上線が0.5秒かけて表示*/ }

/*右線*/
.line2::before {
  top: 0;
  right: 0; }

.lineTrigger.lineanime .line2::before {
  animation: lineAnime2 .5s linear .5s forwards;
  /*表示されて0.5秒後に右線が0.5秒かけて表示*/ }

/*下線*/
.lineTrigger::after {
  bottom: 0;
  right: 0; }

.lineTrigger.lineanime::after {
  animation: lineAnime .5s linear 1s forwards;
  /*表示されて1秒後に下線が0.5秒かけて表示*/ }

/*左線*/
.line2::after {
  bottom: 0;
  left: 0; }

.lineTrigger.lineanime .line2::after {
  animation: lineAnime2 .5s linear 1.5s forwards;
  /*表示されて1.5秒後に左線が0.5秒かけて表示*/ }

@keyframes lineAnime {
  0% {
    width: 0%; }
  100% {
    width: 100%; } }
@keyframes lineAnime2 {
  0% {
    height: 0%; }
  100% {
    height: 100%; } }
/*枠線内側の要素*/
.lineTrigger.lineanime .lineinappear {
  animation: lineInnerAnime .5s linear 1.5s forwards;
  /*1.5秒後に中央のエリアが0.5秒かけて表示*/
  opacity: 0;
  /*初期値を透過0にする*/ }

@keyframes lineInnerAnime {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
/*==================================================
アニメーション設定
===================================*/
/* アニメーションの回数を決めるCSS*/
.count2 {
  animation-iteration-count: 2;
  /*この数字を必要回数分に変更*/ }

.countinfinite {
  animation-iteration-count: infinite;
  /*無限ループ*/ }

/* アニメーションスタートの遅延時間を決めるCSS*/
.delay-time05 {
  animation-delay: 0.5s; }

.delay-time1 {
  animation-delay: 1s; }

.delay-time15 {
  animation-delay: 1.5s; }

.delay-time2 {
  animation-delay: 2s; }

.delay-time25 {
  animation-delay: 2.5s; }

/* アニメーション自体が変化する時間を決めるCSS*/
.change-time05 {
  animation-duration: 0.5s; }

.change-time1 {
  animation-duration: 1s; }

.change-time15 {
  animation-duration: 1.5s; }

.change-time2 {
  animation-duration: 2s; }

.change-time25 {
  animation-duration: 2.5s; }

/* ----------------------------------------------------
リセットCSS
---------------------------------------------------- */
/* A Modern CSS Reset */
*,
*::before,
*::after {
  box-sizing: border-box; }

body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd {
  margin: 0; }

ul[role="list"],
ol[role="list"] {
  list-style: none; }

html:focus-within {
  scroll-behavior: smooth; }

body {
  min-height: 100vh;
  text-rendering: optimizeSpeed;
  line-height: 1.5; }

a:not([class]) {
  text-decoration-skip-ink: auto; }

img,
picture {
  max-width: 100%;
  display: block; }

input,
button,
textarea,
select {
  font: inherit; }

@media (prefers-reduced-motion: reduce) {
  html:focus-within {
    scroll-behavior: auto; }

  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important; } }
html,
body {
  font-size: 62.5%;
  font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic Medium", "Yu Gothic", Verdana, Meiryo, sans-serif; }

b,
strong,
.bold {
  font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI semibold", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic", "Segoe UI", Verdana, Meiryo, sans-serif; }

p {
  white-space: normal;
  word-wrap: break-word; }

/* ----------------------------------------------------
セットアップ
---------------------------------------------------- */
/* ----------------------------------------------------
文字設定
---------------------------------------------------- */
.fb {
  font-weight: bold; }

.fn {
  font-weight: bold; }

.tac {
  text-align: center; }

.tal {
  text-align: left; }

.tar {
  text-align: right; }

.tab {
  text-align: bottom; }

.fs05 {
  font-size: 0.5rem; }

.fs10 {
  font-size: 1rem; }

.fs15 {
  font-size: 1.5rem; }

.fs20 {
  font-size: 2rem; }

.fs25 {
  font-size: 2.5rem; }

.fs30 {
  font-size: 3rem; }

.fs35 {
  font-size: 3.5rem; }

.fs40 {
  font-size: 4rem; }

.fs45 {
  font-size: 4.5rem; }

.fs50 {
  font-size: 5rem; }

.fs55 {
  font-size: 5.5rem; }

.fs60 {
  font-size: 6rem; }

.fs65 {
  font-size: 6.5rem; }

.fs70 {
  font-size: 7rem; }

.fs75 {
  font-size: 7.5rem; }

.fs80 {
  font-size: 8rem; }

.fs85 {
  font-size: 8.5rem; }

.fs90 {
  font-size: 9rem; }

.fs95 {
  font-size: 9.5rem; }

.fs100 {
  font-size: 10rem; }

.fs105 {
  font-size: 10.5rem; }

.fs110 {
  font-size: 11rem; }

.fs115 {
  font-size: 11.5rem; }

.fs120 {
  font-size: 12rem; }

.fs125 {
  font-size: 12.5rem; }

.fs130 {
  font-size: 13rem; }

.fs135 {
  font-size: 13.5rem; }

.fs140 {
  font-size: 14rem; }

.fs145 {
  font-size: 14.5rem; }

.fs150 {
  font-size: 15rem; }

.fs155 {
  font-size: 15.5rem; }

.fs160 {
  font-size: 16rem; }

.fs165 {
  font-size: 16.5rem; }

.fs170 {
  font-size: 17rem; }

.fs175 {
  font-size: 17.5rem; }

.fs180 {
  font-size: 18rem; }

.fs185 {
  font-size: 18.5rem; }

.fs190 {
  font-size: 19rem; }

.fs195 {
  font-size: 19.5rem; }

.fs200 {
  font-size: 20rem; }

.fs205 {
  font-size: 20.5rem; }

.fs210 {
  font-size: 21rem; }

.fs215 {
  font-size: 21.5rem; }

.fs220 {
  font-size: 22rem; }

.fs225 {
  font-size: 22.5rem; }

.fs230 {
  font-size: 23rem; }

.fs235 {
  font-size: 23.5rem; }

.fs240 {
  font-size: 24rem; }

.fs245 {
  font-size: 24.5rem; }

.fs250 {
  font-size: 25rem; }

.fs255 {
  font-size: 25.5rem; }

.fs260 {
  font-size: 26rem; }

.fs265 {
  font-size: 26.5rem; }

.fs270 {
  font-size: 27rem; }

.fs275 {
  font-size: 27.5rem; }

.fs280 {
  font-size: 28rem; }

.fs285 {
  font-size: 28.5rem; }

.fs290 {
  font-size: 29rem; }

.fs295 {
  font-size: 29.5rem; }

.fs300 {
  font-size: 30rem; }

.fs305 {
  font-size: 30.5rem; }

.fs310 {
  font-size: 31rem; }

.fs315 {
  font-size: 31.5rem; }

.fs320 {
  font-size: 32rem; }

.fs325 {
  font-size: 32.5rem; }

.fs330 {
  font-size: 33rem; }

.fs335 {
  font-size: 33.5rem; }

.fs340 {
  font-size: 34rem; }

.fs345 {
  font-size: 34.5rem; }

.fs350 {
  font-size: 35rem; }

.fs355 {
  font-size: 35.5rem; }

.fs360 {
  font-size: 36rem; }

.fs365 {
  font-size: 36.5rem; }

.fs370 {
  font-size: 37rem; }

.fs375 {
  font-size: 37.5rem; }

.fs380 {
  font-size: 38rem; }

.fs385 {
  font-size: 38.5rem; }

.fs390 {
  font-size: 39rem; }

.fs395 {
  font-size: 39.5rem; }

.fs400 {
  font-size: 40rem; }

/* ----------------------------------------------------
レスポンシブ設定
---------------------------------------------------- */
/* ----------------------------------------------------
margin
---------------------------------------------------- */
.mt00 {
  margin-top: 0px !important; }

.mr00 {
  margin-right: 0px !important; }

.mb00 {
  margin-bottom: 0px !important; }

.ml00 {
  margin-left: 0px !important; }

.mt05 {
  margin-top: 5px !important; }

.mr05 {
  margin-right: 5px !important; }

.mb05 {
  margin-bottom: 5px !important; }

.ml05 {
  margin-left: 5px !important; }

.mt10 {
  margin-top: 10px !important; }

.mr10 {
  margin-right: 10px !important; }

.mb10 {
  margin-bottom: 10px !important; }

.ml10 {
  margin-left: 10px !important; }

.mt15 {
  margin-top: 15px !important; }

.mr15 {
  margin-right: 15px !important; }

.mb15 {
  margin-bottom: 15px !important; }

.ml15 {
  margin-left: 15px !important; }

.mt20 {
  margin-top: 20px !important; }

.mr20 {
  margin-right: 20px !important; }

.mb20 {
  margin-bottom: 20px !important; }

.ml20 {
  margin-left: 20px !important; }

.mt25 {
  margin-top: 25px !important; }

.mr25 {
  margin-right: 25px !important; }

.mb25 {
  margin-bottom: 25px !important; }

.ml25 {
  margin-left: 25px !important; }

.mt30 {
  margin-top: 30px !important; }

.mr30 {
  margin-right: 30px !important; }

.mb30 {
  margin-bottom: 30px !important; }

.ml30 {
  margin-left: 30px !important; }

.mt35 {
  margin-top: 35px !important; }

.mr35 {
  margin-right: 35px !important; }

.mb35 {
  margin-bottom: 35px !important; }

.ml35 {
  margin-left: 35px !important; }

.mt40 {
  margin-top: 40px !important; }

.mr40 {
  margin-right: 40px !important; }

.mb40 {
  margin-bottom: 40px !important; }

.ml40 {
  margin-left: 40px !important; }

.mt45 {
  margin-top: 45px !important; }

.mr45 {
  margin-right: 45px !important; }

.mb45 {
  margin-bottom: 45px !important; }

.ml45 {
  margin-left: 45px !important; }

.mt50 {
  margin-top: 50px !important; }

.mr50 {
  margin-right: 50px !important; }

.mb50 {
  margin-bottom: 50px !important; }

.ml50 {
  margin-left: 50px !important; }

.mt55 {
  margin-top: 55px !important; }

.mr55 {
  margin-right: 55px !important; }

.mb55 {
  margin-bottom: 55px !important; }

.ml55 {
  margin-left: 55px !important; }

.mt60 {
  margin-top: 60px !important; }

.mr60 {
  margin-right: 60px !important; }

.mb60 {
  margin-bottom: 60px !important; }

.ml60 {
  margin-left: 60px !important; }

.mt65 {
  margin-top: 65px !important; }

.mr65 {
  margin-right: 65px !important; }

.mb65 {
  margin-bottom: 65px !important; }

.ml65 {
  margin-left: 65px !important; }

.mt70 {
  margin-top: 70px !important; }

.mr70 {
  margin-right: 70px !important; }

.mb70 {
  margin-bottom: 70px !important; }

.ml70 {
  margin-left: 70px !important; }

.mt75 {
  margin-top: 75px !important; }

.mr75 {
  margin-right: 75px !important; }

.mb75 {
  margin-bottom: 75px !important; }

.ml75 {
  margin-left: 75px !important; }

.mt80 {
  margin-top: 80px !important; }

.mr80 {
  margin-right: 80px !important; }

.mb80 {
  margin-bottom: 80px !important; }

.ml80 {
  margin-left: 80px !important; }

.mt85 {
  margin-top: 85px !important; }

.mr85 {
  margin-right: 85px !important; }

.mb85 {
  margin-bottom: 85px !important; }

.ml85 {
  margin-left: 85px !important; }

.mt90 {
  margin-top: 90px !important; }

.mr90 {
  margin-right: 90px !important; }

.mb90 {
  margin-bottom: 90px !important; }

.ml90 {
  margin-left: 90px !important; }

.mt95 {
  margin-top: 95px !important; }

.mr95 {
  margin-right: 95px !important; }

.mb95 {
  margin-bottom: 95px !important; }

.ml95 {
  margin-left: 95px !important; }

.mt100 {
  margin-top: 100px !important; }

.mr100 {
  margin-right: 100px !important; }

.mb100 {
  margin-bottom: 100px !important; }

.ml100 {
  margin-left: 100px !important; }

.ma {
  margin: auto; }

/* ----------------------------------------------------
padding
---------------------------------------------------- */
.pt00 {
  padding-top: 0px !important; }

.pr00 {
  padding-right: 0px !important; }

.pb00 {
  padding-bottom: 0px !important; }

.pl00 {
  padding-left: 0px !important; }

.pt05 {
  padding-top: 5px !important; }

.pr05 {
  padding-right: 5px !important; }

.pb05 {
  padding-bottom: 5px !important; }

.pl05 {
  padding-left: 5px !important; }

.pt10 {
  padding-top: 10px !important; }

.pr10 {
  padding-right: 10px !important; }

.pb10 {
  padding-bottom: 10px !important; }

.pl10 {
  padding-left: 10px !important; }

.pt15 {
  padding-top: 15px !important; }

.pr15 {
  padding-right: 15px !important; }

.pb15 {
  padding-bottom: 15px !important; }

.pl15 {
  padding-left: 15px !important; }

.pt20 {
  padding-top: 20px !important; }

.pr20 {
  padding-right: 20px !important; }

.pb20 {
  padding-bottom: 20px !important; }

.pl20 {
  padding-left: 20px !important; }

.pt25 {
  padding-top: 25px !important; }

.pr25 {
  padding-right: 25px !important; }

.pb25 {
  padding-bottom: 25px !important; }

.pl25 {
  padding-left: 25px !important; }

.pt30 {
  padding-top: 30px !important; }

.pr30 {
  padding-right: 30px !important; }

.pb30 {
  padding-bottom: 30px !important; }

.pl30 {
  padding-left: 30px !important; }

.pt35 {
  padding-top: 35px !important; }

.pr35 {
  padding-right: 35px !important; }

.pb35 {
  padding-bottom: 35px !important; }

.pl35 {
  padding-left: 35px !important; }

.pt40 {
  padding-top: 40px !important; }

.pr40 {
  padding-right: 40px !important; }

.pb40 {
  padding-bottom: 40px !important; }

.pl40 {
  padding-left: 40px !important; }

.pt45 {
  padding-top: 45px !important; }

.pr45 {
  padding-right: 45px !important; }

.pb45 {
  padding-bottom: 45px !important; }

.pl45 {
  padding-left: 45px !important; }

.pt50 {
  padding-top: 50px !important; }

.pr50 {
  padding-right: 50px !important; }

.pb50 {
  padding-bottom: 50px !important; }

.pl50 {
  padding-left: 50px !important; }

.pt55 {
  padding-top: 55px !important; }

.pr55 {
  padding-right: 55px !important; }

.pb55 {
  padding-bottom: 55px !important; }

.pl55 {
  padding-left: 55px !important; }

.pt60 {
  padding-top: 60px !important; }

.pr60 {
  padding-right: 60px !important; }

.pb60 {
  padding-bottom: 60px !important; }

.pl60 {
  padding-left: 60px !important; }

.pt65 {
  padding-top: 65px !important; }

.pr65 {
  padding-right: 65px !important; }

.pb65 {
  padding-bottom: 65px !important; }

.pl65 {
  padding-left: 65px !important; }

.pt70 {
  padding-top: 70px !important; }

.pr70 {
  padding-right: 70px !important; }

.pb70 {
  padding-bottom: 70px !important; }

.pl70 {
  padding-left: 70px !important; }

.pt75 {
  padding-top: 75px !important; }

.pr75 {
  padding-right: 75px !important; }

.pb75 {
  padding-bottom: 75px !important; }

.pl75 {
  padding-left: 75px !important; }

.pt80 {
  padding-top: 80px !important; }

.pr80 {
  padding-right: 80px !important; }

.pb80 {
  padding-bottom: 80px !important; }

.pl80 {
  padding-left: 80px !important; }

.pt85 {
  padding-top: 85px !important; }

.pr85 {
  padding-right: 85px !important; }

.pb85 {
  padding-bottom: 85px !important; }

.pl85 {
  padding-left: 85px !important; }

.pt90 {
  padding-top: 90px !important; }

.pr90 {
  padding-right: 90px !important; }

.pb90 {
  padding-bottom: 90px !important; }

.pl90 {
  padding-left: 90px !important; }

.pt95 {
  padding-top: 95px !important; }

.pr95 {
  padding-right: 95px !important; }

.pb95 {
  padding-bottom: 95px !important; }

.pl95 {
  padding-left: 95px !important; }

.pt100 {
  padding-top: 100px !important; }

.pr100 {
  padding-right: 100px !important; }

.pb100 {
  padding-bottom: 100px !important; }

.pl100 {
  padding-left: 100px !important; }

/* ----------------------------------------------------
// width
---------------------------------------------------- */
.wi10 {
  width: 10%;
  height: auto; }

.wi20 {
  width: 20%;
  height: auto; }

.wi30 {
  width: 30%;
  height: auto; }

.wi40 {
  width: 40%;
  height: auto; }

.wi50 {
  width: 50%;
  height: auto; }

.wi60 {
  width: 60%;
  height: auto; }

.wi70 {
  width: 70%;
  height: auto; }

.wi80 {
  width: 80%;
  height: auto; }

.wi90 {
  width: 90%;
  height: auto; }

.wi100 {
  width: 100%;
  height: auto; }

/* ----------------------------------------------------
// max-width
---------------------------------------------------- */
.mwi50 {
  max-width: 50px; }

.mwi100 {
  max-width: 100px; }

.mwi150 {
  max-width: 150px; }

.mwi200 {
  max-width: 200px; }

.mwi250 {
  max-width: 250px; }

.mwi300 {
  max-width: 300px; }

.mwi350 {
  max-width: 350px; }

.mwi400 {
  max-width: 400px; }

.mwi450 {
  max-width: 450px; }

.mwi500 {
  max-width: 500px; }

.mwi550 {
  max-width: 550px; }

.mwi600 {
  max-width: 600px; }

.mwi650 {
  max-width: 650px; }

.mwi700 {
  max-width: 700px; }

.mwi750 {
  max-width: 750px; }

.mwi800 {
  max-width: 800px; }

.mwi850 {
  max-width: 850px; }

.mwi900 {
  max-width: 900px; }

.mwi950 {
  max-width: 950px; }

.mwi1000 {
  max-width: 1000px; }

.mwi1050 {
  max-width: 1050px; }

.mwi1100 {
  max-width: 1100px; }

.mwi1150 {
  max-width: 1150px; }

.mwi1200 {
  max-width: 1200px; }

.mwi1250 {
  max-width: 1250px; }

.mwi1300 {
  max-width: 1300px; }

.mwi1350 {
  max-width: 1350px; }

.mwi1400 {
  max-width: 1400px; }

.mwi1450 {
  max-width: 1450px; }

.mwi1500 {
  max-width: 1500px; }

.mwi1550 {
  max-width: 1550px; }

.mwi1600 {
  max-width: 1600px; }

.mwi1650 {
  max-width: 1650px; }

.mwi1700 {
  max-width: 1700px; }

.mwi1750 {
  max-width: 1750px; }

.mwi1800 {
  max-width: 1800px; }

.mwi1850 {
  max-width: 1850px; }

.mwi1900 {
  max-width: 1900px; }

.mwi1950 {
  max-width: 1950px; }

.mwi2000 {
  max-width: 2000px; }

/* ----------------------------------------------------
// calc-width
---------------------------------------------------- */
.wi-c00 {
  width: calc(0% - 10px); }

.wi-c25 {
  width: calc(25% - 10px); }

.wi-c50 {
  width: calc(50% - 10px); }

.wi-c75 {
  width: calc(75% - 10px); }

.wi-c100 {
  width: calc(100% - 10px); }

/* ----------------------------------------------------
// PC・・SP切り替え
---------------------------------------------------- */
.pc {
  display: none; }
  @media screen and (min-width: 768px) {
    .pc {
      display: block; } }

.sp {
  display: block; }
  @media screen and (min-width: 768px) {
    .sp {
      display: none; } }

.none {
  display: none; }

/* ----------------------------------------------------
// レスポンシブwidth
---------------------------------------------------- */
.wi50-25 {
  width: calc(50% - 10px); }
  @media screen and (min-width: 768px) {
    .wi50-25 {
      width: calc(25% - 10px); } }

/* ----------------------------------------------------
// フレックスボックス設定
---------------------------------------------------- */
@media screen and (min-width: 768px) {
  .flbPc {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: space-between; } }

.flbSp {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: space-between; }

* {
  box-sizing: border-box; }

figure img {
  width: 100%; }

* {
  color: #171717; }

h1 {
  font-size: 4rem; }

h2 {
  font-size: 3.5rem;
  margin-bottom: 2%;
  color: #08447B; }

h3 {
  font-size: 2rem;
  margin-bottom: 2%; }

p {
  font-size: 1.4rem;
  margin-bottom: 2%;
  color: #08447B;
  line-height: 1.9; }

article,
section {
  margin-bottom: 2%; }

strong {
  background: linear-gradient(transparent 70%, #fffc00 0%);
  padding: 0 10px;
  color: #08447B; }

input[type="text"] {
  padding: 10px;
  border: #08447B; }

input[type="password"] {
  padding: 10px;
  border: #08447B; }

input[type="submit"] {
  padding: 10px 20px;
  border: #08447B;
  margin-top: 10px;
  font-size: 1.5rem; }

body {
  overflow: auto;
  background: #e8e7e3; }

.loginForm {
  padding: 80px 15px;
  width: 90%;
  margin: auto; }
  @media screen and (min-width: 768px) {
    .loginForm {
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      border-radius: 5px;
      max-width: 400px;
      background: #fff;
      padding: 60px; } }
  .loginForm .logo img {
    width: 90%;
    max-width: 220px;
    margin: auto; }
  .loginForm p {
    font-size: 1.1rem; }
  .loginForm .logTittle {
    text-align: center;
    margin: 20px auto;
    display: flex;
    align-items: center; }
    .loginForm .logTittle:before, .loginForm .logTittle:after {
      content: "";
      flex-grow: 1;
      height: 1px;
      /* 線の太さを変えたいときはここを変える */
      background: #cecece;
      /* 線の色を変えたいときはここを変える */
      margin: 0 .4em;
      /* 文字と線の余白用 なくても良い */ }
  .loginForm form input[type="text"],
  .loginForm form input[type="password"] {
    width: 100%; }
  .loginForm form input[type="submit"] {
    width: 100%;
    background: #08447B;
    color: #fff; }

.headerArea {
  text-align: center;
  padding: 50px 20px;
  width: 100%;
  margin: auto;
  background: #fff; }
  @media screen and (min-width: 768px) {
    .headerArea {
      padding: 15px 20px; } }
  .headerArea .logo {
    margin-bottom: 30px; }
    @media screen and (min-width: 768px) {
      .headerArea .logo {
        margin-bottom: 0px; } }
    .headerArea .logo img {
      max-width: 220px;
      margin: auto; }
  .headerArea .change {
    background: #08447B;
    color: #fff;
    cursor: pointer;
    border-radius: 3px; }
  .headerArea .logout {
    border: solid 1px #d4d4d4;
    padding: 10px 20px;
    font-size: 1rem; }
    @media screen and (min-width: 768px) {
      .headerArea .logout {
        margin-left: 30px;
        display: flex;
        align-items: center;
        height: 100%; } }

.videoSec {
  width: 100%;
  margin-top: 20px; }
  .videoSec .videoArt {
    width: 95%;
    background: #fff;
    margin: 0 auto 30px;
    order: 1; }
    @media screen and (min-width: 768px) {
      .videoSec .videoArt {
        width: 30%; }
        .videoSec .videoArt.first {
          width: 100%;
          order: 0; }
          .videoSec .videoArt.first div video-js {
            padding-top: unset !important;
            height: calc(100vh - 220px) !important;
            margin-bottom: 10px; } }
    .videoSec .videoArt div video-js {
      width: 100%;
      height: auto !important;
      padding-top: 56.312% !important; }
      .videoSec .videoArt div video-js .vjs-big-play-button {
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        margin: auto; }
    .videoSec .videoArt .videoBo {
      padding: 10px;
      margin-bottom: 10px; }
      .videoSec .videoArt .videoBo h2 {
        font-size: 1.3rem;
        margin-bottom: 0; }
      .videoSec .videoArt .videoBo p {
        font-size: 1.2rem;
        margin-bottom: 0; }

@media screen and (min-width: 768px) {
  .transform01 {
    width: 270px;
    margin-left: auto;
    margin-top: 110px; } }
.transform01 .videoArt {
  width: 95%;
  background: #fff;
  margin: 0 auto 10px; }
  @media screen and (min-width: 768px) {
    .transform01 .videoArt {
      width: 95%; }
      .transform01 .videoArt.first {
        width: calc(100% - 300px);
        position: fixed;
        left: 10px; }
        .transform01 .videoArt.first .videoBo h2 {
          font-size: 2rem; }
        .transform01 .videoArt.first div video-js {
          height: 60vh;
          margin-bottom: 10px; } }
  .transform01 .videoArt div video-js {
    width: 100%; }
    @media screen and (min-width: 768px) {
      .transform01 .videoArt div video-js {
        height: 170px; } }
    .transform01 .videoArt div video-js .vjs-big-play-button {
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;
      margin: auto; }
  .transform01 .videoArt .videoBo {
    padding: 10px 20px;
    margin-bottom: 10px; }
    .transform01 .videoArt .videoBo h2 {
      font-size: 1.3rem;
      margin-bottom: 0; }
    .transform01 .videoArt .videoBo p {
      font-size: 1.2rem;
      margin-bottom: 0; }
    @media screen and (min-width: 768px) {
      .transform01 .videoArt .videoBo div {
        width: 80%; } }

@media screen and (min-width: 768px) {
  .transformHead01 {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 15;
    box-shadow: 0px 0px 5px 0px #d2d2d2; } }
.dbtn {
  margin-top: 10px;
  border: solid 1px #08447B;
  padding: 10px;
  display: flex;
  align-items: center;
  text-decoration: none;
  font-size: 1.5rem;
  color: #08447B;
  vertical-align: middle;
  border-radius: 3px;
  text-decoration: none;
  justify-content: center;
  transition: 0.3s; }
  .dbtn:hover {
    color: #fff;
    background: #08447B; }
  @media screen and (min-width: 768px) {
    .dbtn {
      margin-top: 0;
      max-height: 40px; } }

/*# sourceMappingURL=style.css.map */