963 lines
19 KiB
HTML
963 lines
19 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<meta charset="UTF-8" />
|
|
<title>Page Title</title>
|
|
<style></style>
|
|
<body>
|
|
<div
|
|
style="
|
|
display: grid;
|
|
grid-template-columns: repeat(13, minmax(0, 1fr));
|
|
gap: 1rem;
|
|
margin-bottom: 1rem;
|
|
"
|
|
>
|
|
<div
|
|
style="
|
|
background-color: #000000;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
neutral0
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #1f1926;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
neutral10
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #342e3c;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
neutral20
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #4b4453;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
neutral30
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #635b6b;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
neutral40
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #7d7485;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
neutral50
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #807788;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
neutral51
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #978d9f;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
neutral60
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #b2a7ba;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
neutral70
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #cec2d5;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
neutral80
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #eadef2;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
neutral90
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #fff7ff;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
neutral98
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #ffffff;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
neutral100
|
|
</div>
|
|
</div>
|
|
<div
|
|
style="
|
|
display: grid;
|
|
grid-template-columns: repeat(13, minmax(0, 1fr));
|
|
gap: 1rem;
|
|
margin-bottom: 1rem;
|
|
"
|
|
>
|
|
<div
|
|
style="
|
|
background-color: #000000;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
red0
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #410006;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
red10
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #680010;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
red20
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #93001a;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
red30
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #bf0026;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
red40
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #e82439;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
red50
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #ff5358;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
red60
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #ff8986;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
red70
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #ffb3b0;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
red80
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #ffdad8;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
red90
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #ffedeb;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
red95
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #ffffff;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
red100
|
|
</div>
|
|
</div>
|
|
<div
|
|
style="
|
|
display: grid;
|
|
grid-template-columns: repeat(13, minmax(0, 1fr));
|
|
gap: 1rem;
|
|
margin-bottom: 1rem;
|
|
"
|
|
>
|
|
<div
|
|
style="
|
|
background-color: #000000;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
green0
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #0f2000;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
green10
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #1d3700;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
green20
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #2d5000;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
green30
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #3d6a00;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
green40
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #4e8500;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
green50
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #60a100;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
green60
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #74be11;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
green70
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #7ac51b;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
green72
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #8edb34;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
green80
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #a9f850;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
green90
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #efffd8;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
green98
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #ffffff;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
green100
|
|
</div>
|
|
</div>
|
|
<div
|
|
style="
|
|
display: grid;
|
|
grid-template-columns: repeat(13, minmax(0, 1fr));
|
|
gap: 1rem;
|
|
margin-bottom: 1rem;
|
|
"
|
|
>
|
|
<div
|
|
style="
|
|
background-color: #000000;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
yellow0
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #1d1d00;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
yellow10
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #323200;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
yellow20
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #494900;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
yellow30
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #626200;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
yellow40
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #7b7b00;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
yellow50
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #969600;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
yellow60
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #b1b100;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
yellow70
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #cdcd00;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
yellow80
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #e0e01f;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
yellow87
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #eaea2c;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
yellow90
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #fffeac;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
yellow98
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #ffffff;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
yellow100
|
|
</div>
|
|
</div>
|
|
<div
|
|
style="
|
|
display: grid;
|
|
grid-template-columns: repeat(13, minmax(0, 1fr));
|
|
gap: 1rem;
|
|
margin-bottom: 1rem;
|
|
"
|
|
>
|
|
<div
|
|
style="
|
|
background-color: #000000;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
purple0
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #270057;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
purple10
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #42008a;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
purple20
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #5e07bd;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
purple30
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #661bc5;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
purple33
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #7734d6;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
purple40
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #9152f1;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
purple50
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #a974ff;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
purple60
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #bf98ff;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
purple70
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #d5baff;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
purple80
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #ecdcff;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
purple90
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #ffffff;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
purple100
|
|
</div>
|
|
</div>
|
|
<div
|
|
style="
|
|
display: grid;
|
|
grid-template-columns: repeat(13, minmax(0, 1fr));
|
|
gap: 1rem;
|
|
margin-bottom: 1rem;
|
|
"
|
|
>
|
|
<div
|
|
style="
|
|
background-color: #000000;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
blue0
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #001d36;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
blue10
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #003258;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
blue20
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #00497c;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
blue30
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #0061a3;
|
|
color: #fff;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
blue40
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #1b7ac5;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
blue50
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #4395e2;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
blue60
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #62b0fe;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
blue70
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #9ecaff;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
blue80
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #d1e4ff;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
blue90
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #e9f1ff;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
blue95
|
|
</div>
|
|
<div
|
|
style="
|
|
background-color: #ffffff;
|
|
color: #000;
|
|
height: 10rem;
|
|
border: solid 1px grey;
|
|
display: grid;
|
|
place-items: end;
|
|
"
|
|
>
|
|
blue100
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|