svg+js实现一个逼真ClimaCode气象天气工具模拟仪器效果代码
代码语言：html
所属分类：布局界面
代码描述：svg+js实现一个逼真ClimaCode气象天气工具模拟仪器效果代码
代码标签： svg js 逼真 ClimaCode 气象 天气 工具 模拟 仪器
下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
@font-face{font-family:transponder aoe;font-style:normal;font-weight:400;src:local('Transponder AOE'),url(//repo.bfw.wiki/bfwrepo/font/TRANA___.woff) format('woff')}@font-face{font-family:transponder grid aoe;font-style:normal;font-weight:400;src:local('Transponder Grid AOE'),url(//repo.bfw.wiki/bfwrepo/font/TRANA___.woff) format('woff')}
html, body {
height: 100%;
-webkit-user-select: none; /* Safari 3.1+ */
-moz-user-select: none; /* Firefox 2+ */
-ms-user-select: none; /* IE 10+ */
user-select: none; /* Standard syntax */
}
body {
display: flex;
justify-content: center;
background: rgb(194 206 219);
background: linear-gradient(205deg, rgb(238 233 245) 0%, rgb(30 34 42) 100%);
margin: 0;
font-family:'poppins', sans-serif;
}
.footer {
position: absolute;
bottom: 0;
right: 0;
font-family: monospace;
color: #aaa;
padding: 10px;
font-size: 12px;
}
#noise-svg {
height: 100%;
width: 100%;
opacity: 0.1;
}
#noise-rect {
width: 100vw;
height: 100vh;
}
.outer-rim,
.outer-rim *{
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
background: linear-gradient(205deg, rgb(69 75 85) 0%, rgb(22 25 32) 100%);
}
.outer-rim {
--init-size: min(min(712px, 90vw) , 90vh);
width: var(--init-size);
height: var(--init-size);
border-radius: 50%;
overflow: hidden;
box-shadow: -40px 40px 30px 10px rgb(0, 0, 0, 0.4),
-80px 80px 40px 10px rgb(0, 0, 0, 0.6),
-120px 120px 80px 10px rgb(0, 0, 0, 0.6);
}
.outer-rim-2 {
width: calc(var(--init-size) * 0.97);
height: calc(var(--init-size) * 0.97);
box-shadow: 2px -2px 2px 0 rgb(108, 115, 129, 0.8),
-30px 30px 12px 10px rgb(0, 0, 0, 0.5),
inset -2px 2px 2px 0 rgb(108, 115, 129, 0.2),
inset 2px -2px 2px 0px rgb(0, 0, 0, 0.3);
border-radius: 50%;
}
.inner-rim {
border-radius: 50%;
width: calc(var(--init-size) * 0.92);
height: calc(var(--init-size) * 0.92);
box-shadow:
-2px 2px 2px 0 rgba(108, 115, 129, 0.4),
2px -2px 1px 0px rgba(0, 0, 0, 0.2),
inset -3px 3px 2px 1px rgba(0, 0, 0, 0.5);
}
.outer-window.invert{
rotate: 180deg;
transform-origin: 50% 88%;
scale: 0.99;
}
.outer-window {
background: none;
width: calc(var(--init-size) * 0.83);
height: calc(var(--init-size) * 0.83 / 1.7);
overflow: hidden;
top: 4%;
bottom: unset;
}
.window {
top: -1%;
background: none;
width: calc(var(--init-size) * 0.83);
height: calc(var(--init-size) * 0.83 / 2);
bottom: unset;
border-radius: 12px;
overflow: hidden;
box-shadow:
-2px 2px 2px 0 rgba(108, 115, 129, 0.4),
2px -2px 1px 0px rgba(0, 0, 0, 0.2);
}
.outer-window:not(.invert) svg {
opacity: 0;
transition: opacity 0.6s ease-in-out;
}
.power-on .outer-window:not(.invert) svg {
opacity: unset;
}
.window-rounded svg#mountains{
bottom: unset;
width: 100%;
left: 0%;
filter: contrast(1) grayscale(0.6) brightness(1);
}
.window-rounded svg#mountains #clouds,
.window-rounded svg#mountains #mid-clouds{
opacity: 0;
translate: 0 10%;
}
.window-rounded svg#mountains #strike-1,
.window-rounded svg#mountains #strike-2,
.window-rounded svg#mountains #back-clouds-1,
.window-rounded svg#mountains #back-clouds-2,
.window-rounded svg#mountains #back-clouds-3 {
opacity: 0;
translate: 0 -4%;
}
.window-rounded svg#mountains #moon{
translate: 0 60%;
}
.window-rounded svg#mountains #snow-1,
.window-rounded svg#mountains #snow-2{
opacity: 0;
scale: 1.5;
}
.window-rounded svg#mountains #stars{
opacity: 0;
translate: 0 30%;
}
.window-rounded svg#mountains #sky {
fill: #9fcfeb;
}
.power-on .window-rounded svg#mountains,
.power-on .window-rounded svg#mountains *{
transition: all 2s ease-in-out !important;
}
/* sunset */
.window-rounded svg#mountains.sunset {
filter: contrast(0.8) grayscale(0.6) brightness(1.2) sepia(0.3);
}
.window-rounded svg#mountains.sunset #sky {
fill: rgb(255, 81, 0) !important;
}
.window-rounded svg#mountains.sunset #sun {
fill: rgb(255 240 0) !important;
translate:-14% 20%;
scale: 1.3;
}
/* moon */
.window-rounded svg#mountains.moon {
filter: contrast(1) grayscale(0.7) brightness(0.8);
}
.window-rounded svg#mountains.moon #sky {
fill: rgb(0 47 108) !important;
}
.window-rounded svg#mountains.moon #sun {
translate:0 70%;
opacity: 0;
}
.window-rounded svg#mountains.moon #moon{
translate: 0 0%;
}
.window-rounded svg#mountains.moon #stars{
opacity: 1;
translate: 0 0%;
}
.window-rounded svg#mountains.moon #stars path:nth-child(1){
animation: starAnimation 12s infinite linear;
transform-origin: 48% 7%;
animation-delay: 1s;
}
.window-rounded svg#mountains.moon #stars path:nth-child(6){
animation: starAnimation 8s reverse infinite linear;
transform-origin: 32% 28%;
animation-delay: 1s;
}
.window-rounded svg#mountains.moon #stars path:nth-child(10){
animation: starAnimation 10s infinite linear;
transform-origin: 64% 13%;
animation-delay: 1s;
}
@keyframes starAnimation {
0% {
transform: rotate(0deg) scale(1);
}
49% {
scale: 1;
}
50% {
scale: 1.5;
}
51% {
scale: 1;
}
100% {
transform: rotate(360deg) scale(1);
scale: 1;
}
}
/* clouds */
.window-rounded svg#mountains.clouds #clouds,
.window-rounded svg#mountains.clouds #mid-clouds{
opacity: 1;
translate: 0 0%;
}
.window-rounded svg#mountains.clouds #mid-clouds-1,
.window-rounded svg#mountains.clouds #clouds {
animation: cloudsAnimation 12s infinite ease-in-out !important;
}
.window-rounded svg#mountains.clouds #mid-clouds-2,
.window-rounded svg#mountains.clouds #top-cloud{
animation: cloudsAnimation 7s infinite ease-in-out !important;
animation-delay: -3s;
}
@keyframes cloudsAnimation {
0% {
translate: 1% 0;
}
50% {
translate: -1% 0;
}
100% {
translate: 1% 0;
}
}
/* storm */
.window-rounded svg#mountains.storm > *:not(#strike-1):not(#strike-2) {
transition: all 2s ease-in-out;
animation: stormAnimation 10s infinite ease-in-out, stormAnimation2 12s infinite ease-in-out;
}
.window-rounded svg#mountains.storm #clouds,
.window-rounded svg#mountains.storm #back-clouds-1,
.window-rounded svg#mountains.storm #back-clouds-2,
.window-rounded svg#mountains.storm #back-clouds-3 {
opacity: 1;
translate: 0 0%;
filter: contrast(1) grayscale(0.7) brightness(0.6);
animation: cloudsAnimation 12s infinite ease-in-out !important;
}
.window-rounded svg#mountains.storm #strike-1 {
animation: lightningAnimation 10s infinite ease-in-out;
}
.window-rounded svg#mountains.storm #strike-2 {
animation: lightningAnimation 12s infinite ease-in-out;
}
@keyframes stormAnimation {
20% {
filter: contrast(1) grayscale(0.7) brightness(0.6);
}
21% {
filter: contrast(1) grayscale(0.7) brightness(1);
}
22% {
filter: contrast(1) grayscale(0.7) brightness(0.6);
}
80% {
filter: contrast(1) grayscale(0.7) brightness(0.6);
}
81% {
filter: contrast(1) grayscale(0.7) brightness(1);
}
82% {
filter: contrast(1) grayscale(0.7) brightness(0.6);
}
}
@keyframes stormAnimation2 {
20% {
filter: contrast(1) grayscale(0.7) brightness(0.6);
}
21% {
filter: contrast(1) grayscale(0.7) brightness(1);
}
22% {
filter: contrast(1) grayscale(0.7) brightness(0.6);
}
80% {
filter: contrast(1) grayscale(0.7) brightness(0.6);
}
81% {
filter: contrast(1) grayscale(0.7) brightness(1);
}
82% {
filter: contrast(1) grayscale(0.7) brightness(0.6);
}
}
@keyframes lightningAnimation {
20% {
opacity: 0;
}
21% {
opacity: 1;
filter: drop-shadow(0px 0px 10px rgb(255, 208, 0));
}
22% {
opacity: 0;
}
80% {
opacity: 0;
}
81% {
opacity: 1;
filter: drop-shadow(0px 0px 10px rgb(255, 208, 0));
}
82% {
opacity: 0;
}
}
.window-rounded svg#mountains.storm #snow-1 {
animation: stormRainAnimation 1s infinite linear !important;
opacity: 0.3;
}
.window-rounded svg#mountains.storm #snow-2 {
animation: stormRainAnimation 1.1s infinite linear !important;
opacity: 0.3;
}
@keyframes stormRainAnimation {
0% {
transform: translateY(-30%) translateX(-20%);
opacity: 0;
}
6% { opacity: 0.3;}
94% { opacity: 0.3;}
100% {
transform: translateY(20%) translateX(0%);
opacity: 0;
}
}
/* snow */
.window-rounded svg#mountains.snow > *:not(#strike-1):not(#strike-2) {
transition: all 2s ease-in-out;
animation: snowTransition 2s ease-in-out;
filter: contrast(1) grayscale(0.5) brightness(1);
}
@keyframes snowTransition {
0% {
filter: contrast(1) grayscale(0.7) brightness(0.6);
}
100% {
filter: contrast(1) grayscale(0.5) brightness(1);
}
}
.window-rounded svg#mountains.snow #clouds,
.window-rounded svg#mountains.snow #back-clouds-1,
.window-rounded svg#mountains.snow #back-clouds-2,
.window-rounded svg#mountains.snow #back-clouds-3 {
opacity: 1;
translate: 0 0%;
}
.window-rounded svg#mountains.snow #snow-1 {
transform: translateY(-200%) translateX(-2%);
animation: snowflakeAnimation 10s infinite ease-in-out !important;
opacity: 0;
}
.window-rounded svg#mountains.snow #snow-2 {
animation: snowflakeAnimation 11.3s infinite ease-in-out !important;
opacity: 0;
animation-delay: -5s !important;
}
@keyframes snowflakeAnimation {
0% {
transform: translateY(-35%) translateX(-2%);
opacity: 0;
}
10% { transform: translateY(-30%) translateX(-0%); opacity: 0.5;}
20% { transform: translateY(-25%) translateX(-2%);}
30% { transform: translateY(-20%) translateX(-0%);}
40% { transform: translateY(-15%) translateX(-2%);}
50% { transform: translateY(-10%) translateX(-0%);}
60% { transform: translateY(-5%) translateX(-2%);}
70% { transform: translateY(0%) translateX(-0%);}
80% { transform: translateY(5%) translateX(-2%);}
90% { transform: translateY(10%) translateX(-0%); opacity: 0.5;}
100% {
transform: translateY(20%) translateX(-2%);
opacity: 0;
}
}
/* ---- */
.invert .window-rounded{
background: linear-gradient(0deg, rgba(0,0,0,0.7) 48%, rgba(255,255,255,0) 57%, rgba(255,255,255,0) 100%), rgb(202, 216, 228);
box-shadow:
-2px 2px 1px 0px rgba(0, 0, 0, 0.4),
2px -2px 2px 0 rgba(108, 115, 129, 0.2),
inset -4px -3px 12px 1px rgba(152, 243, 248, 0.1),
inset 2px 3px 7px 1px rgba(0, 0, 0, 0.5);
}
.invert .window {
box-shadow:
2px -2px 1px 0 rgba(108, 115, 129, 0.4),
-2px 4px 3px 0px rgba(0, 0, 0, 0.4);
}
.window-rounded {
background: rgb(0, 0, 0, 0.5);
border-radius: 50%;
height: 200%;
bottom: unset;
top: 1.1%;
margin: 1px;
overflow: hidden;
box-shadow:
-2px 2px 2px 0 rgba(108, 115, 129, 0.4),
2px -2px 1px 0px rgba(0, 0, 0, 0.2),
inset -3px 3px 2px 1px rgba(0, 0, 0, 0.5);
}
.loading-bar {
background: none;
width: 18%;
height: 1.4%;
bottom: 8%;
border-radius: 50px;
overflow: hidden;
box-shadow:
0px 0px 2px 1px rgba(0, 0, 0, 0.2),
-1px 2px 6px 4px rgba(0, 0, 0, 0.3),
1px -2px 6px 4px rgba(255, 255, 255, 0.5),
inset 0px 0px 0px 12px rgba(0, 0, 0, 0.8);
}
.outer-rim:not(.power-on) .loading-bar > div{
width: 0%;
}
.loading-bar > div {
--color-1: rgba(152, 243, 248, 0.9);
--color-2: rgba(0,0,0, 0.7);
background: var(--color-1);
width: 21.9%;
height: 50%;
transition: all 0.2s ease-in-out;
opacity: 0;
left: unset;
right: 3%;
}
.loading-bar > div:nth-child(1) {
border-top-right-radius: 20px;
border-bottom-right-radius: 20px;
transition-delay: 0.2s;
}
.loading-bar > div:nth-child(2) {
translate: -110%;
transition-delay: 0.4s;
}
.loading-bar > div:nth-child(3) {
translate: -220%;
transition-delay: 0.6s;
}
.loading-bar > div:nth-child(4) {
translate: -330%;
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;
transition-delay: 0.8s;
}
.power-on .loading-bar.active > div {
opacity: 1;
}
.back-circle {
border-radius: 50%;
width: 30%;
height: 30%;
bottom: unset;
top: 12.2%;
right: 0.5%;
background: none;
box-shadow:
-12px 22px 22px 0px rgba(152, 243, 248,0.2),
-6px 12px 12px 4px rgba(152, 243, 248, 0.2),
0px 0px 0px 4px rgba(108, 115, 129, 0);
}
.circle {
border-radius: 50%;
width: 30%;
height: 30%;
bottom: unset;
top: 12.2%;
right: 0.5%;
transition: transform 1s ease-in-out;
box-shadow:
0px 0px 2px 2px rgba(108, 115, 129, 0.4),
0px 0px 3px 4px rgba(108, 115, 129, 0.2);
}
.inner-circle {
border-radius: 50%;
width: 28.6%;
height: 28.6%;
bottom: unset;
top: 12.5%;
box-shadow:
26px -26px 42px 20px rgba(0, 0, 0, 0.5),
16px -16px 22px 0px rgba(0, 0, 0, 0.4),
6px -6px 12px 0px rgba(0, 0, 0, 0.5),
inset -3px 3px 2px 1px rgba(0, 0, 0, 0.5),
inset 5px -5px 14px 3px rgba(108, 115, 129, 0.5),
inset 10px -10px 12px 5px rgba(0, 0, 0, 0.1);
display: block;
background: linear-gradient(25deg, rgb(69 75 85) 0%, rgb(22 25 32) 100%);
cursor: pointer;
}
.sixths-container {
background: none;
transition: transform 1s ease-in-out;
}
.sixths {
width: 24.3%;
height: 100%;
background: none;
rotate: 0deg;
transform-origin: 50%;
}
.sixths:nth-child(2) {rotate: -60deg;}
.sixths:nth-child(3) {rotate: -120deg;}
.sixths:nth-child(4) {rotate: -180deg;}
.sixths:nth-child(5) {rotate: -240deg;}
.sixths:nth-child(6) {rotate: -300deg;}
.sixths .icon {
background: none;
width: 100%;
height: 24.3%;
top: unset;
bottom: 5%;
}
.sixths .icon svg{
width: 100%;
height: 100%;
background: none;
}
.sixths .icon svg *{
opacity: 0.07;
transition: all 0.5s ease-in-out;
filter: drop-shadow(0px 0px 4px rgba(152, 243, 248, 0.1));
}
.power-on .sixths .icon svg *{
opacity: 0.4;
transition-delay: 0.5s;
}
.power-on .sixths.active .icon svg > *{
opacity: 1;
transition: all 0.5s ease-in-out;
/* fill:rgba(152, 243, 248,0.9); */
filter: drop-shadow(0px 0px 6px rgba(152, 243, 248, 1));
}
.left-modal {
background: rgb(40, 44, 54);
width: 13%;
height: 45%;
border-radius: 14px;
left: unset;
right: 4%;
bottom: unset;
box-shadow:
0 0 6px 2px rgba(0, 0, 0, 0.4),
inset 0px -44px 18px -20px rgba(0, 0, 0, 0.2),
inset 4px -4px 18px 4px rgba(0, 0, 0, 0.3),
inset -2px 1px 4px 1px rgba(108, 115, 129, 0.3),
inset -10px 2px 10px -4px rgba(108, 115, 129, 0.5);
}
.power {
rotate: 180deg;
width: 69%;
height: 19.88%;
border-radius: 12px;
top: unset;
bottom: 4.5%;
left: unset;
right: 15.5%;
overflow: hidden;
box-shadow:
-4px 4px 4px 0px rgba(0, 0, 0, 0.3),
0px 0px 0px 1px rgba(0,0,0, 0.6);
cursor: pointer;
transition: box-shadow 0.1s ease-in-out;
}
.power:hover{
box-shadow:
-3px 3px 2px 0px rgba(0, 0, 0, 0.3),
0px 0px 0px 1px rgba(0,0,0, 0.6),
inset 0px 0px 5px 3px rgba(0,0,0, 0.2),
inset 0px 0px 0px 1px rgba(0,0,0, 0.3);
}
.power:hover .inner-power {
scale: 0.97;
}
.inner-power {
rotate: 180deg;
width: 80%;
height: 80%;
border-radius: 10px;
box-shadow:
4px -4px 18px 4px rgba(0, 0, 0, 0.3),
0px 0px 2px 1px rgba(108, 115, 129, 0.6),
inset 0px -54px 18px -20px rgba(0, 0, 0, 0.2),
inset 4px -4px 18px 4px rgba(0, 0, 0, 0.3);
}
.power:hover .inner-power{
box-shadow:
4px -4px 18px 4px rgba(0, 0, 0, 0.4),
0px 0px 2px 1px rgba(108, 115, 129, 0.6),
inset 0px -54px 18px -20px rgba(0, 0, 0, 0.2),
inset 4px -4px 18px 4px rgba(0, 0, 0, 0.4);
}
.inner-power::before {
display: block;
content: "";
width: 40%;
height: 40%;
border-radius: 50%;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin: auto;
border: 2px solid rgba(152, 243, 248,0.6);
box-shadow:
0px 0px 4px 2px rgba(152, 243, 248, 0.1);
transition: all 0.1s ease-in-out;
}
.inner-power::after{
display: block;
content: "";
width: 4%;
height: 25%;
border-radius: 2px;
position: absolute;
left: 0;
right: 0;
top: 30%;
bottom: 0%;
margin: auto;
background: rgba(152, 243, 248, 0.5);
box-shadow:
0px 0px 4px 2px rgba(152, 243, 248, 0.2),
0px 0px 0px 3px rgba(19,21,26, 1),
0px 0px 4px 3px rgba(19,21,26, 0.5);
transition: all 0.1s ease-in-out;
}
.power-on .inner-power::before {
border: 2px solid rgba(152, 243, 248, 1);
box-shadow:
0px 0px 4px 2px rgba(152, 243, 248, 0.5);
}
.power-on .inner-power::after {
background: rgba(152, 243, 248, 1);
box-shadow:
0px 0px 4px 2px rgba(152, 243, 248, 0.7),
0px 0px 0px 4px rgba(19,21,26, 1),
0px 0px 0px 5px rgba(19,21,26, 0.5);
}
.left-btn-1,
.left-btn-2,
.left-btn-3 {
background: rgb(40, 44, 54);
box-shadow:
inset 2px -2px 4px 0px rgba(255,255,255, 0.2),
inset -2px 2px 4px 0px rgba(0,0,0, 0.2),
2px -2px 5px 0px rgba(0, 0, 0, 1),
0px 0px 2px 1px rgba(0,0,0, 0.3),
0px 0px 0px 1px rgba(0,0,0, 1);
width: 7%;
height: 7%;
border-radius: 8px;
left: unset;
right: 22%;
bottom: 18%;
cursor: pointer;
transition: all 0.2s ease-in-out;
}
.left-btn-2 {
bottom: 38%;
}
.left-btn-3 {
bottom: 58%;
}
.left-btn-1:hover,
.left-btn-2:hover,
.left-btn-3:hover {
box-shadow:
inset 2px -2px 4px 0px rgba(133, 133, 133, 0.2),
inset -2px 2px 4px 0px rgba(0,0,0, 0.2),
1px -1px 3px 0px rgba(0, 0, 0, 1),
0px 0px 2px 1px rgba(0,0,0, 0.3),
0px 0px 0px 1px rgba(0,0,0, 1);
}
.left-btn-1:hover > svg,
.left-btn-2:hover > svg,
.left-btn-3:hover > svg {
scale: 0.97;
}
.left-btn-1 svg,
.left-btn-2 svg,
.left-btn-3 svg {
width: 70%;
height: 70%;
background: none;
rotate: 180deg;
}
.left-btn-1 svg *,
.left-btn-2 svg *,
.left-btn-3 svg * {
opacity: 0.07;
transition: all 0.5s ease-in-out;
fill: rgba(152, 243, 248, 0.7) !important;
filter: drop-shadow(0px 0px 4px rgba(152, 243, 248, 0.1));
}
.power-on .left-btn-1 svg *,
.power-on .left-btn-2 svg *,
.power-on .left-btn-3 svg * {
opacity: 0.4;
}
.power-on .active.left-btn-1 svg *,
.power-on .active.left-btn-2 svg *,
.power-on .active.left-btn-3 svg * {
opacity: 1;
transition: all 0.5s ease-in-out;
filter: drop-shadow(0px 0px 6px rgba(152, 243, 248, 1));
}
.right-modal {
background: rgb(40, 44, 54);
width: 32%;
height: 51%;
right: unset;
left: 0;
bottom: unset;
box-shadow:
inset 0px 0px 40px 42px rgba(0,0,0, 0.3),
inset -24px 0px 16px -22px rgba(158, 192, 201, 1),
inset 0px -54px 18px -20px rgba(0, 0, 0, 0.4),
inset 4px -4px 18px 4px rgba(0, 0, 0, 0.3);
}
.right-modal p.label{
color: rgba(170, 170, 170, 0.2);
background: none;
width: fit-content;
height: fit-content;
rotate: 180deg;
font-size: calc(var(--init-size) / 64);
top: unset;
bottom: 6%;
right: 5%;
pointer-events: none;
}
.power-on .right-modal p.label{
color: rgba(170, 170, 170, 0.8);
text-shadow:
0px 0px 3px rgba(255, 255, 255, 0.4),
0px 0px 8px rgba(255, 255, 255, 0.5);
}
.screen {
background: rgb(0, 0, 0);
width: 60%;
height: 16%;
right: unset;
left: 18%;
top: unset;
bottom: 14%;
text-align: center;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 0 5px 0 rgba(108, 115, 129, 0.5),
inset 0 0 2px 2px rgba(0,0,0, 1),
inset 0 0 2px 2px rgba(255,255,255, 0.7);
}
.power-on p.temp {
color: rgba(255, 255, 255, 0.45);
text-shadow:
0px 0px 3px rgba(255, 255, 255, 0.3),
0px 0px 8px rgba(255, 255, 255, 0.4);
transition: 1s color ease-in-out, 1s text-shadow ease-in-out;
transition-delay: 0.2s;
}
p.temp {
background: none;
font-size: calc(var(--init-size) / 30);
font-weight: 500;
letter-spacing: 4px;
font-family: 'Transponder AOE', sans-serif;
rotate: 180deg;
white-space: nowrap;
padding: 7% 4px 14px 16%;
position: absolute;
pointer-events: none;
}
.toggle {
color: rgba(170, 170, 170, 0.725);
font-size: calc(var(--init-size) / 50);
background: rgba(0, 0, 0, 0.5);
rotate: 180deg;
width: 24%;
height: 8%;
display: flex;
justify-content: center;
align-items: center;
border-radius: 20px;
left: 29%;
bottom: -23%;
box-shadow:
2px -2px 4px 0 rgba(255, 255, 255, 0.1),
-2px 2px 6px 0 rgba(0,0,0, 0.7),
0px -5px 12px 0 rgba(158, 192, 201, 0.1),
inset 0px 0px 1px 1px rgba(0, 0, 0, 0.7),
inset -1px 2px 4px 0 rgba(255, 255, 255, 0.4);
cursor: pointer;
}
.toggle.two{
left: 18%;
right: unset;
}
.power-on .toggle.active {
color: #aaaaaacc;
text-shadow:
0px 0px 3px rgba(255, 255, 255, 0.5),
0px 0px 8px rgba(255, 255, 255, 0.6);
box-shadow:
2px -2px 4px 0 rgba(255, 255, 255, 0.1),
-2px 2px 6px 0 rgba(0,0,0, 0.7),
0px -5px 12px 0 rgba(158, 192, 201, 0.1),
inset 0px 0px 1px 1px rgba(0, 0, 0, 0.7),
inset -1px 2px 4px 0 rgba(255, 255, 255, 0.4);
}
.toggle:hover{
background: rgba(0, 0, 0, 0.6);
box-shadow:
2px -2px 4px 0 rgba(255, 255, 255, 0.1),
-2px 2px 6px 0 rgba(0,0,0, 0.7),
0px -5px 12px 0 rgba(158, 192, 201, 0.1),
inset 0px 0px 1px 1px rgba(0, 0, 0, 0.7),
inset -1px 2px 4px 0 rgba(255, 255, 255, 0.3);
scale: 0.97;
}
g#rocket {
filter: grayscale(0.7);
}
g#rocket #thrusterflame{
fill: rgb(154, 244, 250) !important;
filter: drop-shadow(0 10px 3px rgb(11, 223, 238));
}
@keyframes rocketAnimation {
0% {
transform: translateY(-10%) translateX(60%) rotate(40deg) scale(1);
}
100% {
transform: translateY(-70%) translateX(60%) rotate(0deg) scale(0);
}
}
g#monsterbody {
/* animation: monsterAnimation 24s infinite linear !important; */
opacity: 0;
}
@keyframes monsterAnimation {
0% {
opacity: 1;
translate: -30%;
}
100% {
opacity: 1;
translate: 50%;
}
}
g#biplane {
/* animation: biplaneAnimation 12s infinite linear !important; */
}
@keyframes biplaneAnimation {
0% {
opacity: 1;
translate: 0%;
rotate: 0deg;
}
5% { rotate: 0.2deg }
10% { rotate: -0.2deg }
15% { rotate: 0.2deg }
20% { rotate: -0.2deg }
25% { rotate: 0.2deg }
30% { rotate: -0.2deg }
35% { rotate: 0.2deg }
40% { rotate: -0.2deg }
45% { rotate: 0.2deg }
50% { rotate: -0.2deg }
55% { rotate: 0.2deg }
60% { rotate: -0.2deg }
65% { rotate: 0.2deg }
70% { rotate: -0.2deg }
75% { rotate: 0.2deg }
80% { rotate: -0.2deg }
85% { rotate: 0.2deg }
90% { rotate: -0.2deg }
95% { rotate: 0.2deg }
100% {
opacity: 1;
translate: -95%;
}
}
</style>
<script>
window.console = window.console || function(t) {};
</script>
</head>
<body translate="no">
<svg id="noise-svg">
<!-- gives background a bit of texture -->
<filter id='noiseFilter'>
<feTurbulence type='fractalNoise' baseFrequency='0.5' numOctaves='3' stitchTiles='stitch' />
</filter>
<rect id="noise-rect" filter='url(#noiseFilter)' />
</svg>
<div class="outer-rim">
<div class="outer-rim-2">
<div class="inner-rim">
<div class="outer-window">
<div class="window">
<div class="window-rounded">
<?xml version="1.0" encoding="UTF-8"?>
<svg id="mountains" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 875.7 446.1">
<defs>
<clipPath id="clippath">
<path d="M657.1,414.5c-48.8,21-204.4,7.1-235.4,7.6-32.7,1-35.2-6-76.3-13.8-11,6.6-159.8-26.3-108.6-31.5,1.6-1.1,.3-3.6,.4-4.3,.7-.9,6.8,3,7.3,2.3,1-4.7-20.7-12-16.3-15.8,3.5-2.7,11.3,1.2,11.9,.1-.4-1.7-7.8-6.6-3.5-10.6-.1-2.7-5.8-3.8-5.7-5.4,.2-2.1,9.7-2.5,9.9-4.7-8.8-7-.8-5.8-7.1-11.3-.7-2.7,1.8-12.5-.5-15.6,5.5,6.6,6.8,2.5,1.6-5.2-5.1-5.2-14-5.1-3.2-5.9-.9-12.5-4.2-11.2-9.3-15.5,1.9-2.9,1.4-13.6-.5-16,.3-3.7,208.5,13,486.5,36.9,32.3,27.8,39.3,63.2,26.5,79.1-9.2,11.5-27.5,11.3-32.6,11.2-8.6,15.5-27,13.3-45.1,18.4Z" style="fill: none;"/>
</clipPath>
</defs>
<path id="sky" d="M873.8,7c-.1-1.6,0-3.2,.1-4.9H2.6V444.2H873.8V7h0Z"/>
<g id="moon">
<path d="M438,125.5c-2,1.5-3.5,3.4-4.4,5.6-.8,1.8-2.1,3.7-4.1,5.9-5.3,5.7-11.2,9.9-17.9,12.7-6.3,2.6-12.9,3.7-19.9,3.1-10-.8-19.3-4.4-28-11-.5-.4-.8-1.1-.5-1.8,.5-1.4,.7-2.7,.5-3.8-.1-1.2-.8-2.2-2-2.9-2.4-1.5-4.4-.8-5.9,2.1-.1,.2-.2,.4-.2,.7-.5,1.8-.8,1.7-1-.4,0-.5,0-.9,.2-1.4,.6-1.5,.6-2.7,0-3.7-2.3-3.6-4-7.4-5.1-11.5-.7-2.6-1-4.9-.9-6.8,0,0,.2-1,.6-2.9,.4-2-.6-2.8-3-2.4-.2,0-.5,.1-.9,.2-1.7,.6-1.9,.3-.7-1,.5-.4,1-.7,1.6-.9,1.2-.2,1.8-.8,1.7-1.7-.1-.5-.1-.8,0-1,1-5,2.1-9.9,3.6-14.8,0-.1,.1-.4,.1-.9,.1-.6,.4-.9,1-.9,.4,0,.7-.1,.9-.3,1.3-1.1,2.2-2.3,2.7-3.7,1.8-4.8,4.7-8.6,8.5-11.4,1.2-.9,1.7-1.8,1.5-2.8" style="fill: none; stroke: #f2f2f3; stroke-width: 2px;"/>
<path d="M438,125.5c-2,1.5-3.5,3.4-4.4,5.6-.8,1.8-2.1,3.7-4.1,5.9-5.3,5.7-11.2,9.9-17.9,12.7-6.3,2.6-12.9,3.7-19.9,3.1-10-.8-19.3-4.4-28-11-.5-.4-.8-1.1-.5-1.8,.5-1.4,.7-2.7,.5-3.8-.1-1.2-.8-2.2-2-2.9-2.4-1.5-4.4-.8-5.9,2.1-.1,.2-.2,.4-.2,.7-.5,1.8-.8,1.7-1-.4,0-.5,0-.9,.2-1.4,.6-1.5,.6-2.7,0-3.7-2.3-3.6-4-7.4-5.1-11.5-.7-2.6-1-4.9-.9-6.8,0,0,.2-1,.6-2.9,.4-2-.6-2.8-3-2.4-.2,0-.5,.1-.9,.2-1.7,.6-1.9,.3-.7-1,.5-.4,1-.7,1.6-.9,1.2-.2,1.8-.8,1.7-1.7-.1-.5-.1-.8,0-1,1-5,2.1-9.9,3.6-14.8,0-.1,.1-.4,.1-.9,.1-.6,.4-.9,1-.9,.4,0,.7-.1,.9-.3,1.3-1.1,2.2-2.3,2.7-3.7,1.8-4.8,4.7-8.6,8.5-11.4,1.2-.9,1.7-1.8,1.5-2.8,15.6-6.1,30.3-5.6,44,1.5,6.2,3.2,11.5,7.4,16,12.5,6.6,7.6,10.6,16.6,12.1,27,.6,5.3,.5,10.8-.5,16.7h0Z" style="fill: #fff;"/>
<path d="M366.2,67.9c.2,1-.3,1.9-1.5,2.8-3.8,2.8-6.6,6.7-8.5,11.4-.5,1.3-1.4,2.6-2.7,3.7-.2,.2-.5,.3-.9,.3-.5,0-.9,.3-1,.9s-.1,.9-.1,.9c-1.5,4.9-2.6,9.8-3.6,14.8v1c.1,.8-.5,1.4-1.7,1.7-.6,.1-1.2,.4-1.6,.9-1.2,1.2-1,1.6,.7,1,.4-.1,.6-.2,.9-.2,2.4-.4,3.4,.4,3,2.4-.4,1.9-.6,2.8-.6,2.9-.1,1.9,.2,4.2,.9,6.8,1.1,4.1,2.8,8,5.1,11.5,.6,1,.6,2.2,0,3.7-.2,.4-.3,.9-.2,1.4,.2,2,.5,2.1,1,.4,.1-.3,.2-.5,.2-.7,1.5-2.9,3.5-3.6,5.9-2.1,1.2,.7,1.9,1.7,2,2.9,.1,1.1,0,2.4-.5,3.8-.2,.7,0,1.4,.5,1.8,8.6,6.6,17.9,10.3,28,11,7,.5,13.6-.5,19.9-3.1,6.6-2.8,12.6-7,17.9-12.7,2-2.1,3.3-4.1,4.1-5.9,.9-2.2,2.4-4.1,4.4-5.6-3.6,16.4-12.6,28.5-27,36.3-5.6,3.1-11.7,4.9-18.3,5.7-6.2,.7-12.4,.2-18.7-1.4-12.2-3.1-22-9.7-29.2-19.8-4.1-5.6-7-11.8-8.6-18.3-2.7-10.6-2-21.1,2.1-31.6,5.4-13.1,14.7-22.6,28.1-28.6h0Z" style="fill: #e5e5e7;"/>
<circle cx="375.7" cy="85" r="6" style="fill: #e5e5e7;"/>
<circle cx="394.8" cy="104.3" r="3.2" style="fill: #e5e5e7;"/>
<ellipse cx="368.75" cy="110.67" rx="3.1" ry="3.2" transform="translate(78.16 363.22) rotate(-57.7)" style="fill: #e5e5e7;"/>
<circle cx="420.6" cy="113.6" r="6.1" style="fill: #e5e5e7;"/>
<circle cx="383.5" cy="124.5" r="2.2" style="fill: #e5e5e7;"/>
<ellipse cx="407.51" cy="130.9" rx="1.2" ry="1.4" transform="translate(-20.51 129.36) rotate(-17.6)" style="fill: #e5e5e7;"/>
<circle cx="392.6" cy="143.3" r="3.1" style="fill: #e5e5e7;"/>
</g>
<g id="stars">
<path d="M408,32.3c-.6-.3-.6-.5,0-.8,3.8-1.6,5.9-3.8,6.5-6.7,.3-1.3,.6-1.3,1.1-.1,1.3,3.4,3.7,5.7,7.1,6.8,1.2,.4,1.1,.7,0,1-3.1,.8-5.5,3-7,6.7-.3,.7-.5,.7-.8,0-1.5-3.2-3.8-5.5-6.9-6.9h0Z" style="fill: #fff;"/>
<path d="M338.7,52.3c-.4-.2-.4-.4,0-.6,1.2-.6,2.2-1.4,2.9-2.6,.2-.4,.7-.5,1-.3l3.1,2.8c.3,.2,.1,.7-.2,.9-1.1,.6-2.1,1.4-2.8,2.4-.2,.3-.6,.3-.8,0-.9-1.1-1.9-2-3.2-2.6h0Z" style="fill: #fff;"/>
<path d="M481.3,79.4c-.3-.4-.3-1,0-1.4l2-2.3c.3-.3,.7-.4,1-.2,1,.8,1.9,1.7,2.5,2.8,.2,.3,.1,.8-.2,1.1l-2.3,2.5c-.2,.2-.6,.2-.8,0l-2.2-2.5h0Z" style="fill: #fff;"/>
<path d="M464.1,186.1c1.4,.4,1.4,.8,0,1.2-1.3,.4-2.2,1.3-2.7,2.7-.5,1.6-1,1.6-1.5,0-.4-1.4-1.2-2.2-2.4-2.4-1.7-.3-1.8-.8-.3-1.7,1.2-.7,2.2-1.7,2.9-2.9,.8-1.4,1.2-1.3,1.4,.3,.1,1.4,1,2.4,2.6,2.8Z" style="fill: #fff;"/>
<path d="M75.2,29c.7,.3,.7,.6-.1,.8-2.7,.8-5.1,2.9-6.9,6.1-.3,.6-.6,.6-.9-.1-1.1-2.9-3.2-5-6.1-6.1-.6-.2-.6-.5-.1-.8,3.3-2,5.4-4.2,6.2-6.7,.3-.8,.6-.8,.9-.1,1.5,3.1,3.8,5.3,7,6.9h0Z" style="fill: #fff;"/>
<path d="M268.6,126c-.6-.3-.6-.5,0-.8,3.8-1.6,5.9-3.8,6.5-6.7,.3-1.3,.6-1.3,1.1-.1,1.3,3.4,3.7,5.7,7.1,6.8,1.2,.4,1.1,.7,0,1-3.1,.8-5.5,3-7,6.7-.3,.7-.5,.7-.8,0-1.6-3.3-3.8-5.6-6.9-6.9h0Z" style="fill: #fff;"/>
<path d="M82.5,93.7c-.4-.2-.4-.4,0-.6,1.2-.6,2.2-1.4,2.9-2.6,.2-.4,.7-.5,.9-.3l3.1,2.8c.3,.2,.1,.7-.2,.9-1.2,.6-2.1,1.4-2.8,2.4-.2,.3-.6,.3-.8,0-.8-1-1.8-1.9-3.1-2.6h0Z" style="fill: #fff;"/>
<path d="M369.4,227.7c1.4,.4,1.4,.8,0,1.2-1.3,.4-2.2,1.3-2.7,2.7-.5,1.6-1,1.6-1.5,0-.4-1.4-1.2-2.2-2.4-2.4-1.7-.3-1.8-.8-.3-1.7,1.2-.7,2.2-1.7,2.9-2.9,.8-1.4,1.2-1.3,1.4,.3,.2,1.4,1,2.3,2.6,2.8Z" style="fill: #fff;"/>
<path d="M210.3,59.3c.7,.3,.7,.6-.1,.8-2.7,.8-5.1,2.9-6.9,6.1-.3,.6-.6,.6-.9-.1-1.1-2.9-3.2-5-6.1-6.1-.6-.2-.6-.5-.1-.8,3.3-2,5.4-4.2,6.2-6.7,.3-.8,.6-.8,.9-.1,1.6,3.1,3.9,5.4,7,6.9h0Z" style="fill: #fff;"/>
<path d="M554.3,64.5c-.5,.2-.6,.1-.5-.4,1-3.2,.7-5.8-.8-7.7-.7-.8-.5-1.1,.5-.7,2.9,1,5.5,.7,8-.9,.8-.5,1-.4,.6,.6-1.2,2.4-1,5,.6,8,.3,.5,.1,.7-.4,.5-2.9-.9-5.5-.7-8,.6h0Z" style="fill: #fff;"/>
<path d="M530.2,118.9c-.4,.2-.5,.1-.4-.3,.3-1.1,.3-2.2-.1-3.2-.1-.3,0-.7,.3-.7l3.4-.5c.3,0,.5,.3,.4,.6-.2,1-.2,2.1,0,3.1,.1,.3-.1,.5-.4,.5-1-.1-2.1,.1-3.2,.5Z" style="fill: #fff;"/>
<path d="M622.8,42.9c-.4,0-.8-.3-.8-.7l-.4-2.5c-.1-.3,.1-.7,.4-.7,1-.2,2.1-.3,3.1-.1,.3,0,.5,.3,.6,.7l.4,2.8c0,.3-.2,.5-.4,.5h-2.9Z" style="fill: #fff;"/>
<path d="M681.3,110.2c1-.7,1.3-.5,.8,.7-.5,1-.4,2.1,.3,3.2,.7,1.2,.5,1.5-.8,.9-1.1-.5-2-.4-2.8,.2-1.1,1-1.5,.7-1.2-.7,.2-1.2,.1-2.3-.3-3.4-.5-1.2-.2-1.4,.9-.7,.9,.6,2,.5,3.1-.2h0Z" style="fill: #fff;"/>
<path d="M714.1,54.6c.6-.3,.7-.1,.5,.5-.9,2.2-.8,4.7,.2,7.6,.2,.5,0,.7-.5,.5-2.4-.8-4.8-.6-7.1,.7-.4,.2-.6,.1-.5-.4,.5-3.2,.2-5.7-1-7.5-.4-.6-.2-.8,.5-.6,2.6,.7,5.3,.4,7.9-.8h0Z" style="fill: #fff;"/>
</g>
<g id="Fillgaps">
<path d="M157,72.6c.3-.3,.4-.5,.4-.8" style="fill: none; stroke: #3b9bbd; stroke-width: 2px;"/>
<path d="M157.2,71.8c.1,0,.2,0,.2,.1-.2,.2-1.3-.1-.2-.1" style="fill: none; stroke: #3b9bbd; stroke-width: 2px;"/>
<path d="M871.7,179.5c-10.7,.6-16,18.7-24.4,7.7" style="fill: none; stroke: #175883; stroke-width: 2px;"/>
<path d="M847.2,187.1c-5.6-1.6,1.7-11.3-4.9-7.6" style="fill: none; stroke: #103c5f; stroke-width: 2px;"/>
<path d="M842.2,179.6c-3.8-19.5,17.7-11.9,29.1-18.7" style="fill: none; stroke: #1e5b86; stroke-width: 2px;"/>
<path d="M157,72.6c-5.3,5.1-10.9,9.7-17,13.8" style="fill: none; stroke: #7eabd1; stroke-width: 2px;"/>
<path d="M34.7,85.9c-6.9-15.6-20.3,.8-30.4,3.9" style="fill: none; stroke: #2f87af; stroke-width: 2px;"/>
<path d="M802.9,87.9c-1.2-6.2-7.2-5.4-11.7-7.5" style="fill: none; stroke: #398cb2; stroke-width: 2px;"/>
<path d="M791.3,80.3c-4.8-.9-10.9-5.7-15.5-3.2" style="fill: none; stroke: #4d8cb6; stroke-width: 2px;"/>
<path d="M775.7,77.1c-1.9,.8-1.3-2.4-2.7-1.7" style="fill: none; stroke: #4692b4; stroke-width: 2px;"/>
<path d="M773,75.3c-2.2-2.2-3.4,7.1-5,9.1" style="fill: none; stroke: #8eb9d5; stroke-width: 2px;"/>
<path d="M179.8,88.1c-6.5-5.6-14.2-9.7-21.1-15" style="fill: none; stroke: #3e7ca1; stroke-width: 2px;"/>
<path d="M158.7,73.1c-.4-.6-1-.7-1.7-.5" style="fill: none; stroke: #7eabd1; stroke-width: 2px;"/>
<path d="M872.1,97.4c-8.6,11.7-10.6,26.7-16.8,39.8" style="fill: none; stroke: #8994be; stroke-width: 2px;"/>
<path d="M855.3,137.2l-1.5,1.9" style="fill: none; stroke: #7e91b9; stroke-width: 2px;"/>
<path d="M853.8,139.1c2.1-6.9,5.4-15.3,7-22.8" style="fill: none; stroke: #9cbcdb; stroke-width: 2px;"/>
<path d="M860.7,116.3c1.2-3.5,1.8-9.4,4.8-13" style="fill: none; stroke: #96b8d8; stroke-width: 2px;"/>
<path d="M865.5,103.4c2.3-2.9,4.1-6.1,5.5-9.6" style="fill: none; stroke: #91b5d7; stroke-width: 2px;"/>
<path d="M870.6,147.7c-4.1-4.6-8.1-9.6-15.3-10.5" style="fill: none; stroke: #2e608b; stroke-width: 2px;"/>
<path d="M158.7,73.1l-1.8,2.2" style="fill: none; stroke: #7c88b3; stroke-width: 2px;"/>
<path d="M156.9,75.3l-9.5,8.5" style="fill: none; stroke: #8f95c5; stroke-width: 2px;"/>
<path d="M147.5,83.8c-4.1,3.7-8.8,6.5-14,8.2" style="fill: none; stroke: #7987b0; stroke-width: 2px;"/>
<path d="M133.5,92.1l-5.2,2.6" style="fill: none; stroke: #6e81a8; stroke-width: 2px;"/>
<path d="M128.2,94.6c-5.1,.9-7.7,8.9-9.3,13" style="fill: none; stroke: #7289b1; stroke-width: 2px;"/>
<path d="M119,107.6c-.6-.5-.8-.9-.6-1.3" style="fill: none; stroke: #8bb4d5; stroke-width: 2px;"/>
<path d="M118.4,106.3c2-3.2,2-7.5,4.3-10.4" style="fill: none; stroke: #86b0d3; stroke-width: 2px;"/>
<path d="M122.7,95.9c6.1-2.6,11.8-5.8,17.2-9.5" style="fill: none; stroke: #82aed2; stroke-width: 2px;"/>
<path d="M179.8,88.1l6.2,14.5" style="fill: none; stroke: #437fa3; stroke-width: 2px;"/>
<path d="M186,102.6c-3.9-4.3,.5,7.9-2.5,11-2,3.1-1.7-3.4-3.1-.8" style="fill: none; stroke: #385881; stroke-width: 2px;"/>
<path d="M180.3,112.8c-6.4-12.9-11.4-10.2-24.9-22.9" style="fill: none; stroke: #2e557a; stroke-width: 2px;"/>
<path d="M155.4,89.8c-1-1.2-2.5-4.4-4.5-3.7" style="fill: none; stroke: #2d5278; stroke-width: 2px;"/>
<path d="M151,86.1l6-10.7" style="fill: none; stroke: #4f6696; stroke-width: 2px;"/>
<path d="M773,75.3l-.3,1.2" style="fill: none; stroke: #94acca; stroke-width: 2px;"/>
<path d="M772.7,76.6c-4.6,13-6.2,25.3-9,37.3" style="fill: none; stroke: #90a6c8; stroke-width: 2px;"/>
<path d="M763.7,113.9c-.5-.6-.7-1.5-.6-2.6" style="fill: none; stroke: #9bc2da; stroke-width: 2px;"/>
<path d="M763,111.3l1.1-4.7" style="fill: none; stroke: #98bfd8; stroke-width: 2px;"/>
<path d="M764.2,106.6l3.9-22.2" style="fill: none; stroke: #94bcd7; stroke-width: 2px;"/>
<path d="M775.7,77.1l5,3.8" style="fill: none; stroke: #537fab; stroke-width: 2px;"/>
<path d="M780.7,80.9c-1.5,7-3.7,13.7-6.5,20.2" style="fill: none; stroke: #3f7fa6; stroke-width: 2px;"/>
<path d="M774.2,101.1l-.5,.2" style="fill: none; stroke: #8eaec4; stroke-width: 2px;"/>
<path d="M773.7,101.3c-.4-11.9,2.9-16-1-24.7" style="fill: none; stroke: #487fa6; stroke-width: 2px;"/>
<path d="M151,86.1l-1.3,2" style="fill: none; stroke: #415f8b; stroke-width: 2px;"/>
<path d="M149.7,88.1c-6.2,1.2-.2-4.1-2.1-4.2" style="fill: none; stroke: #4c6593; stroke-width: 2px;"/>
<path d="M791.3,80.3c-.2,3.6,1.2,15.4-1.7,14.2-3-2.8-6-21.2-8.8-13.7" style="fill: none; stroke: #4679a9; stroke-width: 2px;"/>
<path d="M773.7,101.3l-10.2,18.5" style="fill: none; stroke: #89a8c2; stroke-width: 2px;"/>
<path d="M763.5,119.9l.2-6" style="fill: none; stroke: #4f95b6; stroke-width: 2px;"/>
<path d="M34.7,85.9l.5,.7" style="fill: none; stroke: #338ab0; stroke-width: 2px;"/>
<path d="M35.3,86.6c-1.8,4,2.3,.9-.3,7.3,.1,3.9,5.7,12.2,.4,14.3-.5,12.5,11,27.9,19.2,32.9" style="fill: none; stroke: #1d73a3; stroke-width: 2px;"/>
<path d="M54.5,141.1c-2.7,1.2-4.8,2.9-6.2,5.3" style="fill: none; stroke: #23658f; stroke-width: 2px;"/>
<path d="M48.2,146.4l-1,1.2" style="fill: none; stroke: #20618b; stroke-width: 2px;"/>
<path d="M47.3,147.6c0-.4-.1-.6-.5-.5" style="fill: none; stroke: #3174a1; stroke-width: 2px;"/>
<path d="M46.8,147.1c-18.6-3.5-14.6-20.3-24.9-31.4" style="fill: none; stroke: #1d6896; stroke-width: 2px;"/>
<path d="M21.9,115.9c-5.4-6.8-10.4-14.8-17.2-20.5" style="fill: none; stroke: #1e6c9a; stroke-width: 2px;"/>
<path d="M802.9,87.9l3.2,12.5" style="fill: none; stroke: #3d8fb3; stroke-width: 2px;"/>
<path d="M806.2,100.3l.8,3.5" style="fill: none; stroke: #4392b5; stroke-width: 2px;"/>
<path d="M806.9,103.9c-1.5,.2-2.8-.5-3.8-1.9" style="fill: none; stroke: #2c8bb6; stroke-width: 2px;"/>
<path d="M803.1,101.9c-4.8-.4-17.6-.6-22.4,3.4" style="fill: none; stroke: #2d8dba; stroke-width: 2px;"/>
<path d="M780.7,105.3c-7.8,5.5-9.7,13.9-16.5,21.8" style="fill: none; stroke: #7c9ec9; stroke-width: 2px;"/>
<path d="M764.2,127.1c-1.8,.2-.9-1-2-1" style="fill: none; stroke: #2d8dba; stroke-width: 2px;"/>
<path d="M762.2,126.1c4.5-8.1,8.5-16.4,12-24.9" style="fill: none; stroke: #81a8c2; stroke-width: 2px;"/>
<path d="M44.2,97.4l-9-10.8" style="fill: none; stroke: #328eb5; stroke-width: 2px;"/>
<path d="M149.7,88.1c-9.6,19.4-21.5,39.9-16.1,4" style="fill: none; stroke: #2a5176; stroke-width: 2px;"/>
<path d="M186.9,104.1c-.2-.6-.5-1.1-1-1.5" style="fill: none; stroke: #407ea0; stroke-width: 2px;"/>
<path d="M155.4,89.8c-1.1,13.5,4.2,25.2,5.8,38.1" style="fill: none; stroke: #204e6f; stroke-width: 2px;"/>
<path d="M161.3,127.9c3.1,20.2,8,40.1,14.5,59.5" style="fill: none; stroke: #2a5176; stroke-width: 2px;"/>
<path d="M175.8,187.3c1.3,6.6,.3,18.6,6.3,19.7-3.6,2.8-.1,8.5-5.8,8.9-1.6,1.1,.5,5.2-1.2,5-1.7-.8,0,2.1-1.6,1.9-6-1.6-3.3-.3-6.4,1.7" style="fill: none; stroke: #204e6f; stroke-width: 2px;"/>
<path d="M167,224.6l-.2-.1" style="fill: none; stroke: #2f567d; stroke-width: 2px;"/>
<path d="M166.7,224.6c-4.1-3.7-8.9-4.9-13.7-7.9" style="fill: none; stroke: #2a5176; stroke-width: 2px;"/>
<path d="M153,216.6c-12.4-21.7-19.2-39.5-23.1-65.7-18.5-13.3,16,62.6,20.3,67.8" style="fill: none; stroke: #244e70; stroke-width: 2px;"/>
<path d="M150.2,218.6c2.7,5.5,5.9,10.5,9.9,15" style="fill: none; stroke: #2a5176; stroke-width: 2px;"/>
<path d="M160,233.6c3.2,3.5,6.6,6.6,10.3,9.2" style="fill: none; stroke: #2f567d; stroke-width: 2px;"/>
<path d="M170.4,242.8c-1.8,5,1.2,11.1-3,15.1-.6,2.8-5.8-.5-3.7,2.5,.6,.7,1.1,.8,1.6,.2" style="fill: none; stroke: #1d4e72; stroke-width: 2px;"/>
<path d="M165.3,260.6c.4,.4,.9,.6,1.5,.8" style="fill: none; stroke: #21547a; stroke-width: 2px;"/>
<path d="M166.7,261.4c-1.9,1.3-.3,7-2.8,5.6-1.1-8.4-4.5,3.1-.7,6" style="fill: none; stroke: #1d4e72; stroke-width: 2px;"/>
<path d="M163.2,273.1c-3.7,.2-8.1-7.6-7.2-1.8-.4,.4-1-1.7-2.1-.6-3.4-1-4.7-6.2-6.3-1.7-5.8-2.2-9.4-41.7-13.2-22.1" style="fill: none; stroke: #1a496e; stroke-width: 2px;"/>
<path d="M134.3,246.9c-2.5-3.1-2-26.8-3.2-11.1" style="fill: none; stroke: #557498; stroke-width: 2px;"/>
<path d="M131.2,235.9c-.2-6.4-4.7-.9-7.4-5-4.8-6.4-11.6-19.9-8.7-27.8-.2-5.7-2.8-9.4-5.8-12.8,1.3-2.4-.3-5-2.2-6.6-2-3-6,2-6.6-2.2,.2-3.5-4.7-.5-5-2.4-14.8,25.4-14.9,28-43,12.7-11.3-.5-24.8-12.6-34.1-6.9-2.8,.4-1.3-.4-1.1-1.6,0-2.1-1.7-1.1-2.9-1.1-2-1-7-1.7-9-2.4" style="fill: none; stroke: #1d486a; stroke-width: 2px;"/>
<path d="M5.2,179.8c0-.1,.1-.2,.4-.2" style="fill: none; stroke: #1c4f77; stroke-width: 2px;"/>
<path d="M5.6,179.6l15.1-11.9" style="fill: none; stroke: #1d5279; stroke-width: 2px;"/>
<path d="M20.6,167.7c3.7-.9,17.2-3.4,20.4-8.8" style="fill: none; stroke: #316289; stroke-width: 2px;"/>
<path d="M41,158.9c6.6-5.3,14.3,10.3,22,7.9,3.5-1.8,6.2-7.9,10.1-6.3,19.4,9.1,23.5,22,32-5.5" style="fill: none; stroke: #214f73; stroke-width: 2px;"/>
<path d="M105.2,154.9c5-19.3,20.2-35,22.2-54.4" style="fill: none; stroke: #235377; stroke-width: 2px;"/>
<path d="M127.4,100.3c.7-1.3,1-2.8,.9-4.4" style="fill: none; stroke: #415f8b; stroke-width: 2px;"/>
<path d="M128.4,95.9l-.2-1.3" style="fill: none; stroke: #235377; stroke-width: 2px;"/>
<path d="M44.2,97.4l8.5,11" style="fill: none; stroke: #3690b6; stroke-width: 2px;"/>
<path d="M52.7,108.3c5.5,10.2,19.9,16.9,25.9,23.3" style="fill: none; stroke: #3b94b8; stroke-width: 2px;"/>
<path d="M78.6,131.7c-7.4,9.3-12.1,10.9-24.2,9.4" style="fill: none; stroke: #226994; stroke-width: 2px;"/>
<path d="M180.3,112.8c3.3,25.5,13.7,60.7,19.4,85.3" style="fill: none; stroke: #2b5478; stroke-width: 2px;"/>
<path d="M199.8,198.1c0,2.4-1.1,3.9-3.3,4.5" style="fill: none; stroke: #205a7f; stroke-width: 2px;"/>
<path d="M196.5,202.6c-12.2-9.9-13.9-25.6-16.8-39.6-5.2,22.4,12.8,48.7,22.6,68.3" style="fill: none; stroke: #30577d; stroke-width: 2px;"/>
<path d="M202.5,231.3l4.5,9" style="fill: none; stroke: #2a567b; stroke-width: 2px;"/>
<path d="M207,240.3c-2.7,2-2.1,3-4,4.9-3.2,2.5-7.5,.6-9.8,3.3" style="fill: none; stroke: #22577c; stroke-width: 2px;"/>
<path d="M193.2,248.4c-11.6-5.2-20.5-12.5-26.3-23.8" style="fill: none; stroke: #30597f; stroke-width: 2px;"/>
<path d="M175.8,187.3c.7-5-6-70.7-14.5-59.6" style="fill: none; stroke: #2b5478; stroke-width: 2px;"/>
<path d="M3,143.6c5.9-13.6,20.2-7.7,20.5,5.5,6.8-.9,1.7-6,0,0,6.8-.9,11.7,4.6,15.7,9.2" style="fill: none; stroke: #1b5d89; stroke-width: 2px;"/>
<path d="M39.2,158.2c-4.7,6-12.4,5.6-18.5,9.4" style="fill: none; stroke: #2f6995; stroke-width: 2px;"/>
<path d="M5.6,179.6c-.7-.9-1.5-1.8-2.4-2.6" style="fill: none; stroke: #195683; stroke-width: 2px;"/>
<path d="M3,133.1c3.2-2.4,2.7-5,.1-7.7" style="fill: none; stroke: #1d6592; stroke-width: 2px;"/>
<path d="M21.9,115.9c-2.4,6.5-7,26.6-6.5,5.2-4.5,4.6-7.4,10.6-12.6,14.6" style="fill: none; stroke: #1d6592; stroke-width: 2px;"/>
<path d="M128.4,95.9c-4.9,1-5.6,15.7-1,4.5" style="fill: none; stroke: #456794; stroke-width: 2px;"/>
<path d="M105.2,154.9c-7.6,3.8-23.7-12.3-25.7-7.5-13.4,18.8-6.7,9.5-24.2,10.2-6.9,1.2-1.1-12.2-7-11.3" style="fill: none; stroke: #25577c; stroke-width: 2px;"/>
<path d="M78.6,131.7c6.7-16.7,25.5-17.2,40.3-24.1" style="fill: none; stroke: #4186a4; stroke-width: 2px;"/>
<path d="M872,205.2c-7.4-1.4-12.1,5.4-18.3,5" style="fill: none; stroke: #13547e; stroke-width: 2px;"/>
<path d="M853.7,210.1l-5.1-5.4" style="fill: none; stroke: #0c3352; stroke-width: 2px;"/>
<path d="M848.6,204.7c7.1,.4-4.2-7.1,2.1-8-4.4-3.1-4.6-4.3-3.5-9.5" style="fill: none; stroke: #0d3b5d; stroke-width: 2px;"/>
<path d="M808.2,109.3l-1.2-5.5" style="fill: none; stroke: #3da4c6; stroke-width: 2px;"/>
<path d="M187.2,105.4c-.3-.4-.4-.8-.3-1.3" style="fill: none; stroke: #4481a2; stroke-width: 2px;"/>
<path d="M187.2,105.4c1.9,5.8,4.4,11.4,7.3,16.8" style="fill: none; stroke: #4884a3; stroke-width: 2px;"/>
<path d="M194.6,122.2c5.9,12.7,5,28.1,10.2,41.6" style="fill: none; stroke: #2f5479; stroke-width: 2px;"/>
<path d="M204.7,163.8c-13.1-3.8,.2,36.4-.8,44.8" style="fill: none; stroke: #3a5b83; stroke-width: 2px;"/>
<path d="M199.8,198.1c1.6,3.8,1,6.9,4.2,10.5" style="fill: none; stroke: #2a5d85; stroke-width: 2px;"/>
<path d="M762.2,126.1c-.3,.4-.8,.6-1.2,.6" style="fill: none; stroke: #7cbcd8; stroke-width: 2px;"/>
<path d="M761,126.6l-.2-.1" style="fill: none; stroke: #81acc6; stroke-width: 2px;"/>
<path d="M760.7,126.6c-.3-2.2,2.5-4.4,2.8-6.7" style="fill: none; stroke: #95c4d4; stroke-width: 2px;"/>
<path d="M803.1,101.9c-8.1,3.8-10.3,.9-16.8,11.5-20.4,19.6,19.8,5.2,31,6.3" style="fill: none; stroke: #279fcc; stroke-width: 2px;"/>
<path d="M817.2,119.7c3.6,3,13.6,2.6,13.3,8.9" style="fill: none; stroke: #44abce; stroke-width: 2px;"/>
<path d="M830.5,128.6l-.4,1.7" style="fill: none; stroke: #6ab3e1; stroke-width: 2px;"/>
<path d="M830.1,130.3c-19.1,1.4-40.4,9.7-56.5,11.7-4.9-1-12.1-3-17-3.1-2.6,.3-2.4-.9-2.2-2.6-.9-.8-2.6-1.6-2.4-3.3" style="fill: none; stroke: #2ba5d3; stroke-width: 2px;"/>
<path d="M752.2,133.3c.1-.6,10.5-5.7,8.8-6.7" style="fill: none; stroke: #2e91bf; stroke-width: 2px;"/>
<path d="M764.2,127.1c7.1-1.2,11-15.4,16.5-21.7" style="fill: none; stroke: #77b2df; stroke-width: 2px;"/>
<path d="M808.2,109.3c.3,5.9,8.2,3.5,9,10.3" style="fill: none; stroke: #43a8c9; stroke-width: 2px;"/>
<path d="M760.7,126.6c-6.6-1.7-12.8-4.2-18.6-7.5" style="fill: none; stroke: #4799bb; stroke-width: 2px;"/>
<path d="M742.1,119c-1.9,.7-3.1,1.9-3.7,3.6" style="fill: none; stroke: #99cada; stroke-width: 2px;"/>
<path d="M201.3,124.9l-6.8-2.7" style="fill: none; stroke: #41819e; stroke-width: 2px;"/>
<path d="M853.8,139.1c-2.7,.1-5.3-.4-7.8-1.6" style="fill: none; stroke: #4189a9; stroke-width: 2px;"/>
<path d="M845.9,137.5c-3.9-1.8-8.5-6.5-12.7-4.9" style="fill: none; stroke: #459cc0; stroke-width: 2px;"/>
<path d="M833.3,132.6c-.7-1.3-.9-5.3-2.7-4" style="fill: none; stroke: #85bcde; stroke-width: 2px;"/>
<path d="M46.8,147.1l-7.6,11.1" style="fill: none; stroke: #306d99; stroke-width: 2px;"/>
<path d="M742.1,119c-7.3,14.6-11,19.9-21.4,30.3" style="fill: none; stroke: #86b2cc; stroke-width: 2px;"/>
<path d="M720.7,149.3l-.2-.5" style="fill: none; stroke: #87c3dc; stroke-width: 2px;"/>
<path d="M720.4,148.9c6.1-8.9,13.4-16.7,18-26.3" style="fill: none; stroke: #9ecddc; stroke-width: 2px;"/>
<path d="M752.2,133.3l-9.8,6.5" style="fill: none; stroke: #3195c2; stroke-width: 2px;"/>
<path d="M742.4,139.9l-4.5,3.5" style="fill: none; stroke: #3895c0; stroke-width: 2px;"/>
<path d="M738,143.3l-5.5,5.8" style="fill: none; stroke: #4b9ac6; stroke-width: 2px;"/>
<path d="M732.5,149.1l-1,1" style="fill: none; stroke: #629ecb; stroke-width: 2px;"/>
<path d="M731.4,150.1c-3.4,2.5-6.7-3-10.7-.9" style="fill: none; stroke: #3492bd; stroke-width: 2px;"/>
<path d="M201.3,124.9c2.6,4.1,4.1,8.6,4.6,13.5" style="fill: none; stroke: #4684a0; stroke-width: 2px;"/>
<path d="M205.9,138.3l1.3,5.8" style="fill: none; stroke: #4a88a2; stroke-width: 2px;"/>
<path d="M207.2,144.1c.6,4.3,1.6,8.2,2.8,11.9" style="fill: none; stroke: #4e8aa4; stroke-width: 2px;"/>
<path d="M210,156c.8,6.1,2.1,11.8,4,17.1" style="fill: none; stroke: #528da7; stroke-width: 2px;"/>
<path d="M214,173.1c-4.4,.7-2-13.6-6.9-16.1-1.1,4.6,3.4,21-2.4,6.9" style="fill: none; stroke: #33587e; stroke-width: 2px;"/>
<path d="M720.4,148.9c-7-2.5-13.8-5.4-20.4-8.8" style="fill: none; stroke: #4dadcc; stroke-width: 2px;"/>
<path d="M700,140.1c-3.5-5-8.4-8.4-14.7-10.1" style="fill: none; stroke: #4c9cbd; stroke-width: 2px;"/>
<path d="M685.3,130c-2.5,2.7-3.8,6-4.1,9.8" style="fill: none; stroke: #9ecddc; stroke-width: 2px;"/>
<path d="M833.3,132.6c-.5,1.4-.6,2.8-.2,4.2" style="fill: none; stroke: #6ba4d3; stroke-width: 2px;"/>
<path d="M833,136.9l-2.5,5.8" style="fill: none; stroke: #879ccd; stroke-width: 2px;"/>
<path d="M830.5,142.6c-7.1,11.2-13.1,22.3-24,29.4" style="fill: none; stroke: #b8c3ef; stroke-width: 2px;"/>
<path d="M806.5,172.1c-4.1-6-22.4-4.6-30.3-1.9-2.2,3.4-7.8,11.5-12.4,13.3" style="fill: none; stroke: #94c0ed; stroke-width: 2px;"/>
<path d="M763.7,183.4c-6.9-6.3-17.1-2.1-25.7-4.6" style="fill: none; stroke: #6c90ba; stroke-width: 2px;"/>
<path d="M738,178.8c-1.6-3.1-6.5,11.4-7.3,11.8" style="fill: none; stroke: #cecef1; stroke-width: 2px;"/>
<path d="M730.8,190.6l-.8,.6" style="fill: none; stroke: #90a7ce; stroke-width: 2px;"/>
<path d="M730,191.2l-1.3,.7" style="fill: none; stroke: #6c90ba; stroke-width: 2px;"/>
<path d="M728.7,191.9c-5.5-1.2-10.8-2.8-16.7-.2" style="fill: none; stroke: #7eb1e6; stroke-width: 2px;"/>
<path d="M712,191.6l-1.8-.5" style="fill: none; stroke: #6488af; stroke-width: 2px;"/>
<path d="M710.2,191.1c-4.3-3-10.8,.7-14.4-2" style="fill: none; stroke: #607fa6; stroke-width: 2px;"/>
<path d="M695.7,189.1c20.3-12.4,7.1-9.8-6.2-2.2" style="fill: none; stroke: #9ec0ed; stroke-width: 2px;"/>
<path d="M689.5,186.9l-2.5-1" style="fill: none; stroke: #607fa6; stroke-width: 2px;"/>
<path d="M687,185.9c-.4-2.1-10.8-6.5-13-5.9" style="fill: none; stroke: #c4ccee; stroke-width: 2px;"/>
<path d="M674,180.1c-4.7-3.1-9.9-5.1-15.6-5.9" style="fill: none; stroke: #70b3df; stroke-width: 2px;"/>
<path d="M658.4,174.2c1.2-3.3,7.3,.3,9.8-3.1" style="fill: none; stroke: #93c7e6; stroke-width: 2px;"/>
<path d="M668.2,171.1c1.2-.2,2.3-.6,3.2-1.3" style="fill: none; stroke: #6fa3cf; stroke-width: 2px;"/>
<path d="M671.5,169.8c5-1.9,5.9,1.2,7.4,5.2,13.4-8.5,31.2-10.3,45.7-16.6" style="fill: none; stroke: #74b6e2; stroke-width: 2px;"/>
<path d="M724.5,158.6c.4,.1,2.7-1.5,2.7-.4,2.2,15.8,11.8,13.3,22,6.4" style="fill: none; stroke: #9ec0ed; stroke-width: 2px;"/>
<path d="M749.3,164.6l10.2-4.2" style="fill: none; stroke: #87bbe8; stroke-width: 2px;"/>
<path d="M759.5,160.4l11.2-4.3" style="fill: none; stroke: #74b6e2; stroke-width: 2px;"/>
<path d="M770.7,156.1c21.2-11,51.2,2.7,59.4-25.7" style="fill: none; stroke: #6db6e4; stroke-width: 2px;"/>
<path d="M685.3,130c-4.2,14.6-5.2,31.1-17.3,40.9" style="fill: none; stroke: #86b2cc; stroke-width: 2px;"/>
<path d="M668,170.9c2.3-5.9,9.8-14.3,11.5-22.5" style="fill: none; stroke: #aad6e3; stroke-width: 2px;"/>
<path d="M679.5,148.4c.9-2.8,1.5-5.6,1.7-8.6" style="fill: none; stroke: #a2d1de; stroke-width: 2px;"/>
<path d="M700,140.1c-15,1.1-19.6,12.3-24.4,24.6" style="fill: none; stroke: #3492bd; stroke-width: 2px;"/>
<path d="M675.5,164.8l-4.1,5.1" style="fill: none; stroke: #3895c0; stroke-width: 2px;"/>
<path d="M668.2,171.1c-.1,0-.2-.1-.2-.2" style="fill: none; stroke: #57a5c4; stroke-width: 2px;"/>
<path d="M770.7,156.1c-13,1.3-14.4-18.4-28.2-16.2" style="fill: none; stroke: #36a8d4; stroke-width: 2px;"/>
<path d="M845.9,137.5c-3.9,.9-10.1-4.7-12.5-.6" style="fill: none; stroke: #27709e; stroke-width: 2px;"/>
<path d="M833.4,136.9h-.4" style="fill: none; stroke: #477baf; stroke-width: 2px;"/>
<path d="M842.2,179.6c-1.3,1.9,.1,4.6-2.5,6.3" style="fill: none; stroke: #143e60; stroke-width: 2px;"/>
<path d="M839.7,185.9c-2.3-3,1.3-13.1-.9-12.9-6.8,1.1-9.7,13.2-14.2,17.6-7.2,5.9-16.2,10.5-24.7,12.7-4.2,4.9-12.3,.8-14.9-5.3" style="fill: none; stroke: #1e5b86; stroke-width: 2px;"/>
<path d="M785.3,197.9c3.3-7.1,8.3-14.8,15-19.3" style="fill: none; stroke: #1e577e; stroke-width: 2px;"/>
<path d="M800.2,178.6l1.5-1" style="fill: none; stroke: #7490ba; stroke-width: 2px;"/>
<path d="M801.8,177.6c11.1-3.6,20.7-8.9,29.5-18.7" style="fill: none; stroke: #5773a4; stroke-width: 2px;"/>
<path d="M831.2,159c3.8-6.9,2.9-14.5,2.3-22.1" style="fill: none; stroke: #426897; stroke-width: 2px;"/>
<path d="M831.2,159c-5-5.1-5-5.8-2.1-13.4" style="fill: none; stroke: #777eb5; stroke-width: 2px;"/>
<path d="M829.2,145.6l1.3-3" style="fill: none; stroke: #949bcb; stroke-width: 2px;"/>
<path d="M637.5,149.5l-2.9-1.6" style="fill: none; stroke: #57a3bf; stroke-width: 2px;"/>
<path d="M634.5,147.9c-2.7-3.4-6.7,4.4-8.5,6.4" style="fill: none; stroke: #a4c9de; stroke-width: 2px;"/>
<path d="M560.4,147.1c-.6-.6-1.7-3.7-2.9-2.3" style="fill: none; stroke: #56a6c4; stroke-width: 2px;"/>
<path d="M557.5,144.9c.4-4.9-6.5,2.7-8.3,3.9" style="fill: none; stroke: #aecbe1; stroke-width: 2px;"/>
<path d="M759.5,160.4c-8.1-4.8-9.2-16.8-21.4-17.1" style="fill: none; stroke: #50add8; stroke-width: 2px;"/>
<path d="M731.4,150.1l-2.9,3.5" style="fill: none; stroke: #63afdb; stroke-width: 2px;"/>
<path d="M728.5,153.6c-10,5.2-25.1,.9-37.1,5.7-13.7-4-6.6-3.7-15.9,5.5" style="fill: none; stroke: #39a5cf; stroke-width: 2px;"/>
<path d="M829.2,145.6c-5.5,13.6-15.3,22.4-27.3,32" style="fill: none; stroke: #a9a5d7; stroke-width: 2px;"/>
<path d="M800.2,178.6c-13,5-15.7,22.7-27.8,30.3" style="fill: none; stroke: #708ab2; stroke-width: 2px;"/>
<path d="M772.5,208.9c-.9-.6-1.5-1.3-1.8-2.3" style="fill: none; stroke: #b2a9de; stroke-width: 2px;"/>
<path d="M770.7,206.6l4.5-4.5" style="fill: none; stroke: #758cb4; stroke-width: 2px;"/>
<path d="M775.2,202.1l4.9-4.9" style="fill: none; stroke: #798fb8; stroke-width: 2px;"/>
<path d="M780.1,197.2c2.8-2.5,5.1-5.5,6.9-9.1" style="fill: none; stroke: #8db9e8; stroke-width: 2px;"/>
<path d="M787,188.1c5.8-9.2,7.2-7.4,19.5-16.1" style="fill: none; stroke: #a1bfeb; stroke-width: 2px;"/>
<path d="M549.2,148.7c-4,3.6-2.6,10.2-7.2,14.1" style="fill: none; stroke: #b2cde3; stroke-width: 2px;"/>
<path d="M557.5,144.9c-9.7,6-8.5,13.8-13.6,22.8" style="fill: none; stroke: #98b2d3; stroke-width: 2px;"/>
<path d="M544,167.6c-.7,1.1-1.7,1.7-3,1.8" style="fill: none; stroke: #e9cff1; stroke-width: 2px;"/>
<path d="M541,169.4c-1.9-.2-3.6-1-5-2.3" style="fill: none; stroke: #a1b2da; stroke-width: 2px;"/>
<path d="M535.9,167.1l.3-.5" style="fill: none; stroke: #e9cff1; stroke-width: 2px;"/>
<path d="M536.2,166.6c2.6-.4,4.5-1.6,5.8-3.8" style="fill: none; stroke: #b6d0e6; stroke-width: 2px;"/>
<path d="M749.3,164.6c-6.6-2.9-9.5-18.2-16.9-15.5" style="fill: none; stroke: #7ab7e4; stroke-width: 2px;"/>
<path d="M560.4,147.1l7.5,13.8" style="fill: none; stroke: #5ba9c7; stroke-width: 2px;"/>
<path d="M567.9,160.9l6.8,15.8" style="fill: none; stroke: #61aecb; stroke-width: 2px;"/>
<path d="M574.8,176.6c-5.3,2.8-1,9.1-7.5,12.2-3.6,1.2-15.1,7.4-17.8,4-1.8-2-5.6,.6-4.3-4.4" style="fill: none; stroke: #4594bd; stroke-width: 2px;"/>
<path d="M545.2,188.3c19.9-25.2,22-26.2-2.7-2.9" style="fill: none; stroke: #90aad4; stroke-width: 2px;"/>
<path d="M542.4,185.4c3.8-4.4,13-15.8,3.4-15.6,.1-4.6,2.2-6.8-1.9-.8" style="fill: none; stroke: #4191bc; stroke-width: 2px;"/>
<path d="M544,169.1c-.1-.5-.1-.9,0-1.4" style="fill: none; stroke: #90aad4; stroke-width: 2px;"/>
<path d="M41,158.9l6.2-11.2" style="fill: none; stroke: #33668e; stroke-width: 2px;"/>
<path d="M626,154.4l-5.5,9" style="fill: none; stroke: #a9cce2; stroke-width: 2px;"/>
<path d="M634.5,147.9c-12.5,22.8-9.7,7.1-22.8,33.8" style="fill: none; stroke: #8fadcc; stroke-width: 2px;"/>
<path d="M611.7,181.6c-3.6,.8,9.2-17.7,8.7-18.3" style="fill: none; stroke: #afd1e6; stroke-width: 2px;"/>
<path d="M153,216.6c-1-.1-1.9,.6-2.8,2" style="fill: none; stroke: #2f5479; stroke-width: 2px;"/>
<path d="M724.5,158.6l4-5" style="fill: none; stroke: #67b2de; stroke-width: 2px;"/>
<path d="M637.5,149.5c4.8,5.3,13.1,6.4,14.5,13.8" style="fill: none; stroke: #5fa8c4; stroke-width: 2px;"/>
<path d="M652,163.3c-6.3,2.6-14.5-.1-17.6,7.9" style="fill: none; stroke: #3c95bc; stroke-width: 2px;"/>
<path d="M634.4,171.2l-5.7,3.9" style="fill: none; stroke: #539fbc; stroke-width: 2px;"/>
<path d="M628.7,175.1c-6.9,5.1-18,11.5-6,.6,6.1-8-11.4,5.8-6.9,8.3" style="fill: none; stroke: #8db5cc; stroke-width: 2px;"/>
<path d="M615.9,183.9l-5.4-.1" style="fill: none; stroke: #3c95bc; stroke-width: 2px;"/>
<path d="M610.5,183.8c.6-.6,1-1.4,1.2-2.2" style="fill: none; stroke: #62abc6; stroke-width: 2px;"/>
<path d="M658.4,174.2c-4.8,.3-4.2-8.6-6.4-10.9" style="fill: none; stroke: #58b6d4; stroke-width: 2px;"/>
<path d="M536.2,166.6c-2.1-.7-4.1-.6-6,.2" style="fill: none; stroke: #aec8e6; stroke-width: 2px;"/>
<path d="M298.7,170.8c-2.2-1.6-3.9-5.2-6.9-5.4" style="fill: none; stroke: #71b1ce; stroke-width: 2px;"/>
<path d="M291.8,165.3c-9.5,1.8-12.8,15.8-20,21.6" style="fill: none; stroke: #a5d0dd; stroke-width: 2px;"/>
<path d="M271.8,187c-5.3-10.5-17.2-26.8-27.8-13.3" style="fill: none; stroke: #5cb9d7; stroke-width: 2px;"/>
<path d="M244,173.8c-9.7,7.1-20.9,8.7-29.7-.4" style="fill: none; stroke: #58b8d6; stroke-width: 2px;"/>
<path d="M214.3,173.3c0-.1-.1-.2-.2-.2" style="fill: none; stroke: #5d94b2; stroke-width: 2px;"/>
<path d="M214.3,173.3l2.7,8.9" style="fill: none; stroke: #3a82ac; stroke-width: 2px;"/>
<path d="M216.9,182.2c6.6,27.1,11.2,27.5,30.6,64.1" style="fill: none; stroke: #315a82; stroke-width: 2px;"/>
<path d="M247.5,246.3c-1.1,6.8-14.8,.4-20.5,3" style="fill: none; stroke: #365f89; stroke-width: 2px;"/>
<path d="M227,249.3l-23.1-40.8" style="fill: none; stroke: #2f618a; stroke-width: 2px;"/>
<path d="M610.5,183.8c-3.3,.4-3.9-2.8-7-4.4" style="fill: none; stroke: #5cb8d6; stroke-width: 2px;"/>
<path d="M603.5,179.3c-7.2,2.1-9.7,7-7.4,14.8" style="fill: none; stroke: #aec9e6; stroke-width: 2px;"/>
<path d="M596.1,194.1c-.2,1.1-.7,1.9-1.6,2.2" style="fill: none; stroke: #94c5e4; stroke-width: 2px;"/>
<path d="M594.5,196.4c-14,.9-5.5-19.9-19.7-19.8" style="fill: none; stroke: #67b5d2; stroke-width: 2px;"/>
<path d="M196.5,202.6c2.9,3,5.4,6.4,7.5,10" style="fill: none; stroke: #2f618a; stroke-width: 2px;"/>
<path d="M204,212.6c-.9,5.1,1.5,13.7-1.5,18.8" style="fill: none; stroke: #395d87; stroke-width: 2px;"/>
<path d="M2.8,216c1.1,1.7,9.1,4.8,4.8,.5" style="fill: none; stroke: #114065; stroke-width: 2px;"/>
<path d="M7.7,216.6c.8-1.5,4.4-.6,4.2,1.4,.9,2.3,4.8-.8,4.8,3" style="fill: none; stroke: #112e4c; stroke-width: 2px;"/>
<path d="M16.8,220.9c.7,1-3.3,7.6-3.3,4.2,1.7-1.6,2-5.1-.9-4.9,.8,3.6-8.3,7-3.6,8,4,1.2,1.8,3.4,6.1,2.9,.5,1.1-1.8,5.8,.5,4.2,1.9-3.7,3.2-5.7,4.3-.7,1.2-3.5,3.3,.8,4.6-1.1,11.7-.2-2-6.2,.7-9" style="fill: none; stroke: #0e2b4b; stroke-width: 2px;"/>
<path d="M25.2,224.6c6.5,7.5,9.1-3.9,13-7.8" style="fill: none; stroke: #112e4c; stroke-width: 2px;"/>
<path d="M38.2,216.8c.6,.6,.8,1.2,.8,1.5" style="fill: none; stroke: #1d4369; stroke-width: 2px;"/>
<path d="M39,218.3c-1.5,9.7,3.2,16.9,3.3,26.5" style="fill: none; stroke: #0f2b4a; stroke-width: 2px;"/>
<path d="M42.3,244.9c2,8.8-.9,23.3,7.5,20.7,2.8-7.7-3.6-23.9,.1-27.1" style="fill: none; stroke: #0d213e; stroke-width: 2px;"/>
<path d="M49.7,238.5c2,2.9,25.3,51.4,10.7,18.6" style="fill: none; stroke: #1d4369; stroke-width: 2px;"/>
<path d="M60.4,257.1c.6-5,9.4-7,13.1-8.2,.7,.6,4.8,19.6,6.6,11.4,.2-1.8-1-6.1,2.2-5.2" style="fill: none; stroke: #112e4c; stroke-width: 2px;"/>
<path d="M82.4,255.1c0,.6,.3,.9,.8,1" style="fill: none; stroke: #405372; stroke-width: 2px;"/>
<path d="M83.2,256.1c.3,.7,.4,1.5,.3,2.2" style="fill: none; stroke: #112e4c; stroke-width: 2px;"/>
<path d="M83.5,258.3c-1.3,1.6-1,2.8,1,3.6" style="fill: none; stroke: #294369; stroke-width: 2px;"/>
<path d="M84.5,261.9c.2,.8-.1,1.4-.8,1.7" style="fill: none; stroke: #112e4c; stroke-width: 2px;"/>
<path d="M83.7,263.6c-1.3,.7-3.8,2.5-3.1,4,1.7-1.6,2.9-3.2,4.8-.4" style="fill: none; stroke: #253f62; stroke-width: 2px;"/>
<path d="M85.5,267.1c.4,1.2,0,2.1-1,2.8" style="fill: none; stroke: #112e4c; stroke-width: 2px;"/>
<path d="M84.5,269.9c-2.9-2.4-2.4,.4-1.2,1.6,.2,3.2-7.8,2.2-4.3,4.8,2.2,1.2,4.6-2.6,5.5,.7" style="fill: none; stroke: #0b1f3d; stroke-width: 2px;"/>
<path d="M84.5,276.9c-.1,1.2,.4,1.9,1.5,2" style="fill: none; stroke: #112e4c; stroke-width: 2px;"/>
<path d="M86,278.9l1,1.7" style="fill: none; stroke: #0b1f3d; stroke-width: 2px;"/>
<path d="M87,280.6l-2.3,2.5" style="fill: none; stroke: #203a5b; stroke-width: 2px;"/>
<path d="M84.7,283.1c-2.2-.9-4.5-2.6-4.7-4.9-2.4-1.1-9.9,7.8-6.3,6.9,4-5,9.1-3,3.9,2.4-.7,2.4-3.4-.3-4.1,1.7,1.1,2.5-4.6,3.2-2.4,4.6,4.4,3.5,9.5-2.3,11.4,3.3" style="fill: none; stroke: #0b1f3d; stroke-width: 2px;"/>
<path d="M82.4,297.1c0,3-.1,7.2,3.8,7.7" style="fill: none; stroke: #08172f; stroke-width: 2px;"/>
<path d="M86.2,304.8c-3,1.1-3.3,2.6-1,4.5" style="fill: none; stroke: #264368; stroke-width: 2px;"/>
<path d="M85.2,309.3c-1,1.5,1.5,5.7-2.3,2.7-2.2,.9-4.3-1.1-6.4-1.3-5.5,8.5,1.2,5.2-1.1,8.2-12.4,4.4-1.6-2.4-6.4-3-8.4,8.7,7.2,3.5,12.5,12,.1,.9-2.2,1.8-2.5,2.1,1.1-.1,1.6,.5,1.4,1.8" style="fill: none; stroke: #08172f; stroke-width: 2px;"/>
<path d="M80.5,331.9c-3.8,3.1-5.3-13.1-13.3,.1,.4,6.5,7.8,5.6,0,9.8-4,6.6-17,1.3-4.6,9.3,1.3,6.1,5.3,.7-1.2-2.6-2.3-2.4,5.6-2.4,6.4-3.5,7.3-6.6,16,1.2,20.9,7.3" style="fill: none; stroke: #08152b; stroke-width: 2px;"/>
<path d="M88.7,352.1c-2.5-.8-.4,4.1-2.8,1.3" style="fill: none; stroke: #0b213f; stroke-width: 2px;"/>
<path d="M86,353.4c.3-4-7.4-7.1-8.3-2.4" style="fill: none; stroke: #061020; stroke-width: 2px;"/>
<path d="M77.7,351.1c-2,1-2.3-1.2-3.4-2.1-1.2,1.8-1,4.4-4.3,2.1-1.8-1.4-2.7,0-1.9,1.4,1.7,2.1-.8,1.4-2.1,2.1-3.1,4.1,.2,4.5,3.6,3.9,9.6-5.7,23,30-16.5,8.4" style="fill: none; stroke: #071832; stroke-width: 2px;"/>
<path d="M53.2,366.9c3.3-4.3-10.8-5.3-12.5-7.4" style="fill: none; stroke: #0b213f; stroke-width: 2px;"/>
<path d="M40.7,359.5c4-1.2-.9-3.9-1.4-5.9" style="fill: none; stroke: #08172f; stroke-width: 2px;"/>
<path d="M39.2,353.6c5.4,.7-2-4.8-2.5-5.8" style="fill: none; stroke: #0d2441; stroke-width: 2px;"/>
<path d="M36.7,347.8c7,.9,11.1,12.5,15.4,2.3-10-2-16.4-8.3-28.2-8.9" style="fill: none; stroke: #071832; stroke-width: 2px;"/>
<path d="M23.8,341.1c3-2.5-13.2-14.8-5.5-11.5,6.3,7.3,1.2-.5,2.7-.3,7.5,8,3.1-.6,10.1,1.3" style="fill: none; stroke: #0b1f3d; stroke-width: 2px;"/>
<path d="M31.2,330.6c1.9,8,16.5-.3,2.9-3.3-16.6-10.7,9.2,.7,15-3.1,4.8,4.2,2.2-.4,.1-3.6" style="fill: none; stroke: #071832; stroke-width: 2px;"/>
<path d="M49,320.6c-1.5-4-4.2-6.7-8.3-8.2" style="fill: none; stroke: #0b1f3d; stroke-width: 2px;"/>
<path d="M40.7,312.4c1.5-.9,2-2.1,1.5-3.8" style="fill: none; stroke: #08152b; stroke-width: 2px;"/>
.........完整代码请登录后点击上方下载按钮下载查看
热门代码搜索
其他语言代码库
Html代码库
Python代码库
Java代码库
Php代码库
Phpcli代码库
Golang代码库
C#代码库
Nodejs代码库
C代码库
C++代码库
Sql代码库
R代码库
Rust代码库
Ruby代码库
Dart代码库
Vb代码库
D代码库
F#代码库
Typescript代码库
Coffeescript代码库
Julia代码库
Kotlin代码库
Perl代码库
Groovy代码库
Lua代码库
Vala代码库
Ocaml代码库
Assembly代码库
Objectc代码库
Scala代码库
Erlang代码库
Pascal代码库
Swift代码库
Fortran代码库
Bash代码库
Clojure代码库
Ada代码库
Elixir代码库
Cobol代码库
Haskell代码库
Nim代码库
Racket代码库
Lisp代码库
网友评论0