-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
734 lines (694 loc) · 49 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
<!DOCTYPE html>
<meta charset="utf-8">
<html>
<head>
<link href="https://fonts.googleapis.com/css?family=Open+Sans&display=swap" rel="stylesheet">
<style>
#Title{
color: #9245d2;
text-align: center;
font-family: 'Open Sans', sans-serif;
width: 800px;
margin-left: -90px;
}
body{
background-image: url("./background.jpg");
background-size: 100%;
z-index: -5;
}
.grid{
display: grid;
grid-template-columns: 80% 20%;
grid-template-rows: 30px;
grid-gap: 10px;
width: 800px;
}
.grid > div:not(:first-child){
border-radius: 25px;
background-color: rgba(130, 129, 129, .5);
}
#swatchGrid{
grid-row: 1/7;
grid-column: 2;
}
#dropDown{
grid-row: 1/4;
text-align: center;
padding-top: 10px;
background-color: rgba(130, 129, 129, .5);
padding-bottom: 15px;
border-radius: 25px;
}
#svgGrid{
grid-row: 4/7;
}
#swatches{
height: 200px;
width: 100px;
margin:30px 30px;
}
.menuOptions{
z-index: 10;
background-color: black;
border: none;
color: #9245d2;
padding: 15px 25px;
text-align: center;
font-size: 16px;
cursor: pointer;
}
#dropDown{
text-align: center;
}
.hidden{
display: none;
}
select{
padding: 8px 50px;
font-size: 16px;
border-radius: 8px;
background-color: rgba(146, 69, 210, .3);
color: black;
border: rgba(146, 69, 210, .3);
font-weight: bold;
}
#submit{
margin: 0px 40% 20px 40%;
padding: 20px 30px;
font-size: 16px;
font-weight: bold;
background-color: yellow;
border-radius: 25px;
}
</style>
</head>
<body>
<H1 id="Title">
MineSweeping Hoops
</H1>
<div class="grid">
<div id="dropDown">
<select autocomplete="off" onchange="buttonpress(this.value)">
<option class="menuOptions" type="button" value = "1">Pattern 1</option>
<option class="menuOptions" type="button" value = "2" >Pattern 2</option>
<option class="menuOptions" type="button" value = "3" >Pattern 3</option>
<option class="menuOptions" type="button" value = "4" >Pattern 4</option>
</select>
</div>
<div id="swatchGrid">
<svg id="swatches">
<rect style="fill:#000" x="0" y="0" width="40" height="40"/>
<rect style="fill:#1179ce" x="50" y="0" width="40" height="40"/>
<rect style="fill:#a05983" x="0" y="50" width="40" height="40"/>
<rect style="fill:#e6e7d7" x="50" y="50" width="40" height="40"/>
<rect style="fill:#54ad51" x="0" y="100" width="40" height="40"/>
<rect style="fill:#fc777a" x="50" y="100" width="40" height="40"/>
<rect style="fill:#131a46" x="0" y="155" width="40" height="40"/>
<rect style="fill:#fc6e00" x="50" y="155" width="40" height="40"/>
<rect id="selection" style="stroke:#0000ff; stroke-opacity: 1;fill:none; stroke-width: 2" x="0" y="0" width="40" height="40"/>
</svg>
</div>
<div id="svgGrid">
<svg id="currentSvg" xmlns="http://www.w3.org/2000/svg" viewBox="-80.0 150.0 1000.000 300.000" version="1.1">
</svg>
<button Id="submit" type="button">SUBMIT</button>
</div>
</div>
</body>
<svg id="pattern1" class= "hidden" xmlns="http://www.w3.org/2000/svg" width="800.000" height="600.000" viewBox="0.0 0.0 800.000 600.000" version="1.1">
<path d="M1.26 297.17L45.5 258.98 1.26 258.98 1.26 297.17Z
M227.54 341.03L227.54 265.07 139.56 341.03 227.54 341.03Z
M227.54 341.03L234.6 334.94 227.54 265.07 227.54 341.03Z
M234.6 334.94L234.6 258.98 227.54 265.07 234.6 334.94Z
M234.6 334.94L322.58 258.98 234.6 258.98 234.6 334.94Z
M491.49 341.03L491.49 265.07 403.5 341.03 491.49 341.03Z
M491.49 341.03L498.54 334.94 491.49 265.07 491.49 341.03Z
M498.54 334.94L498.54 258.98 491.49 265.07 498.54 334.94Z
M498.54 334.94L586.53 258.98 498.54 258.98 498.54 334.94Z
M755.43 341.03L755.43 265.07 667.45 341.03 755.43 341.03Z
M755.43 341.03L762.49 334.94 755.43 265.07 755.43 341.03Z
M762.49 334.94L762.49 258.98 755.43 265.07 762.49 334.94Z
M762.49 334.94L798.67 303.7 762.49 258.98 762.49 334.94Z
M798.67 303.7L798.67 258.98 762.49 258.98 798.67 303.7Z"
fill-rule="evenodd" fill="#1179ce"/>
<path d="M1.26 341.03L45.5 341.03 1.26 297.17 1.26 341.03Z
M45.5 341.03L45.5 258.98 1.26 297.17 45.5 341.03Z
M45.5 341.03L51.58 341.03 45.5 258.98 45.5 341.03Z
M51.58 341.03L51.58 258.98 45.5 258.98 51.58 341.03Z
M51.58 341.03L146.62 258.98 51.58 258.98 51.58 341.03Z
M315.52 341.03L315.52 265.07 227.54 341.03 315.52 341.03Z
M315.52 341.03L322.58 334.94 315.52 265.07 315.52 341.03Z
M322.58 334.94L322.58 258.98 315.52 265.07 322.58 334.94Z
M322.58 334.94L410.56 258.98 322.58 258.98 322.58 334.94Z
M579.47 341.03L579.47 265.07 491.49 341.03 579.47 341.03Z
M579.47 341.03L586.53 334.94 579.47 265.07 579.47 341.03Z
M586.53 334.94L586.53 258.98 579.47 265.07 586.53 334.94Z
M586.53 334.94L674.51 258.98 586.53 258.98 586.53 334.94Z
M798.67 341.03L798.67 303.7 755.43 341.03 798.67 341.03Z"
fill-rule="evenodd" fill="#a05983"/>
<path d="M139.56 341.03L139.56 265.07 51.58 341.03 139.56 341.03Z
M139.56 341.03L146.62 334.94 139.56 265.07 139.56 341.03Z
M146.62 334.94L146.62 258.98 139.56 265.07 146.62 334.94Z
M146.62 334.94L234.6 258.98 146.62 258.98 146.62 334.94Z
M403.5 341.03L403.5 265.07 315.52 341.03 403.5 341.03Z
M403.5 341.03L410.56 334.94 403.5 265.07 403.5 341.03Z
M410.56 334.94L410.56 258.98 403.5 265.07 410.56 334.94Z
M410.56 334.94L498.54 258.98 410.56 258.98 410.56 334.94Z
M667.45 341.03L667.45 265.07 579.47 341.03 667.45 341.03Z
M667.45 341.03L674.51 334.94 667.45 265.07 667.45 341.03Z
M674.51 334.94L674.51 258.98 667.45 265.07 674.51 334.94Z
M674.51 334.94L762.49 258.98 674.51 258.98 674.51 334.94Z"
fill-rule="evenodd" fill="#e6e7d7"/>
</svg>
<svg id="pattern2" class= "hidden" xmlns="http://www.w3.org/2000/svg" width="800.000" height="600.000" viewBox="0.0 0.0 800.000 600.000" version="1.1">
<path d="M1.27 323.54L36.73 341.02 1.27 297.16 1.27 323.54Z
M36.73 341.02L36.73 266.55 1.27 297.16 36.73 341.02Z
M36.73 341.02L45.52 341.02 36.73 266.55 36.73 341.02Z
M45.52 341.02L45.52 258.96 36.73 266.55 45.52 341.02Z
M45.52 341.02L81.66 341.02 45.52 258.96 45.52 341.02Z
M81.66 341.02L81.66 258.96 45.52 258.96 81.66 341.02Z
M81.66 341.02L127.3 301.62 81.66 258.96 81.66 341.02Z
M127.3 301.62L127.3 258.96 81.66 258.96 127.3 301.62Z
M127.3 301.62L136.74 293.47 127.3 258.96 127.3 301.62Z
M136.74 293.47L136.74 263.62 127.3 258.96 136.74 293.47Z
M158.75 341.02L158.75 322.03 136.74 341.02 158.75 341.02Z
M136.74 293.47L158.75 274.47 136.74 263.62 136.74 293.47Z
M158.75 341.02L193.8 341.02 158.75 322.03 158.75 341.02Z
M193.8 341.02L193.8 291.76 158.75 322.03 193.8 341.02Z
M193.8 341.02L220.93 341.02 193.8 291.76 193.8 341.02Z
M220.93 341.02L220.93 305.13 193.8 291.76 220.93 341.02Z
M220.93 341.02L231.79 341.02 220.93 305.13 220.93 341.02Z
M231.79 341.02L231.79 310.49 220.93 305.13 231.79 341.02Z
M231.79 273.69L231.79 258.96 220.93 268.33 231.79 273.69Z
M231.79 341.02L267.93 341.02 231.79 310.49 231.79 341.02Z
M267.93 341.02L267.93 328.31 231.79 310.49 267.93 341.02Z
M231.79 273.69L267.93 291.51 231.79 258.96 231.79 273.69Z
M267.93 291.51L267.93 258.96 231.79 258.96 267.93 291.51Z
M267.93 341.02L277.3 332.93 267.93 328.31 267.93 341.02Z
M267.93 291.51L277.3 296.13 267.93 258.96 267.93 291.51Z
M277.3 296.13L277.3 258.96 267.93 258.96 277.3 296.13Z
M277.3 296.13L304.43 309.51 277.3 258.96 277.3 296.13Z
M304.43 309.51L304.43 258.96 277.3 258.96 304.43 309.51Z
M304.43 309.51L339.49 279.24 304.43 258.96 304.43 309.51Z
M339.49 279.24L339.49 258.96 304.43 258.96 339.49 279.24Z
M362.98 338.38L362.98 306.52 339.49 326.8 362.98 338.38Z
M339.49 279.24L362.98 258.96 339.49 258.96 339.49 279.24Z
M362.98 338.38L368.34 341.02 362.98 306.52 362.98 338.38Z
M368.34 341.02L368.34 301.88 362.98 306.52 368.34 341.02Z
M368.34 341.02L418.06 341.02 368.34 301.88 368.34 341.02Z
M418.06 341.02L418.06 258.96 368.34 301.88 418.06 341.02Z
M418.06 341.02L454.2 341.02 418.06 258.96 418.06 341.02Z
M454.2 341.02L454.2 258.96 418.06 258.96 454.2 341.02Z
M454.2 341.02L458.91 336.96 454.2 258.96 454.2 341.02Z
M458.91 336.96L458.91 258.96 454.2 258.96 458.91 336.96Z
M458.91 336.96L509.28 293.47 458.91 258.96 458.91 336.96Z
M509.28 293.47L509.28 283.8 458.91 258.96 509.28 293.47Z
M516.41 341.02L516.41 334.87 509.28 341.02 516.41 341.02Z
M509.28 293.47L516.41 287.32 509.28 283.8 509.28 293.47Z
M516.41 341.02L533.54 341.02 516.41 334.87 516.41 341.02Z
M533.54 341.02L533.54 320.08 516.41 334.87 533.54 341.02Z
M533.54 341.02L543.54 341.02 533.54 320.08 533.54 341.02Z
M543.54 341.02L543.54 311.45 533.54 320.08 543.54 341.02Z
M543.54 263.89L543.54 258.96 533.54 258.96 543.54 263.89Z
M543.54 341.02L549.25 341.02 543.54 311.45 543.54 341.02Z
M549.25 341.02L549.25 306.52 543.54 311.45 549.25 341.02Z
M543.54 263.89L549.25 258.96 543.54 258.96 543.54 263.89Z
M549.25 341.02L551.47 341.02 549.25 306.52 549.25 341.02Z
M551.47 341.02L551.47 304.6 549.25 306.52 551.47 341.02Z
M551.47 341.02L578.59 341.02 551.47 304.6 551.47 341.02Z
M578.59 341.02L578.59 317.98 551.47 304.6 578.59 341.02Z
M578.59 341.02L604.33 341.02 578.59 317.98 578.59 341.02Z
M604.33 341.02L604.33 330.67 578.59 317.98 604.33 341.02Z
M604.33 293.87L604.33 258.96 578.59 281.18 604.33 293.87Z
M604.33 341.02L625.33 341.02 604.33 330.67 604.33 341.02Z
M604.33 293.87L625.33 304.22 604.33 258.96 604.33 293.87Z
M625.33 304.22L625.33 258.96 604.33 258.96 625.33 304.22Z
M625.33 304.22L662.09 322.35 625.33 258.96 625.33 304.22Z
M662.09 322.35L662.09 258.96 625.33 258.96 662.09 322.35Z
M662.09 322.35L697.15 292.09 662.09 258.96 662.09 322.35Z
M697.15 292.09L697.15 258.96 662.09 258.96 697.15 292.09Z
M699.95 341.02L699.95 337.22 697.15 339.64 699.95 341.02Z
M697.15 292.09L699.95 289.67 697.15 258.96 697.15 292.09Z
M699.95 289.67L699.95 258.96 697.15 258.96 699.95 289.67Z
M699.95 341.02L735.52 341.02 699.95 337.22 699.95 341.02Z
M735.52 341.02L735.52 306.52 699.95 337.22 735.52 341.02Z
M699.95 289.67L735.52 258.96 699.95 258.96 699.95 289.67Z
M735.52 341.02L790.57 341.02 735.52 306.52 735.52 341.02Z
M790.57 341.02L790.57 258.99 735.52 306.52 790.57 341.02Z
M790.57 341.02L798.72 341.02 790.57 258.99 790.57 341.02Z
M798.72 341.02L798.72 263.01 790.57 258.99 798.72 341.02Z"
fill-rule="evenodd" fill="#e6e7d7"/>
<path d="M1.27 297.16L45.52 258.96 1.27 258.96 1.27 297.16Z
M136.74 341.02L136.74 293.47 81.66 341.02 136.74 341.02Z
M136.74 341.02L158.75 322.03 136.74 293.47 136.74 341.02Z
M158.75 322.03L158.75 274.47 136.74 293.47 158.75 322.03Z
M158.75 322.03L193.8 291.76 158.75 274.47 158.75 322.03Z
M220.93 268.33L220.93 258.96 201.93 258.96 220.93 268.33Z
M220.93 268.33L231.79 258.96 220.93 258.96 220.93 268.33Z
M277.3 341.02L277.3 332.93 267.93 341.02 277.3 341.02Z
M277.3 341.02L293.71 341.02 277.3 332.93 277.3 341.02Z
M339.49 326.8L339.49 279.24 304.43 309.51 339.49 326.8Z
M339.49 326.8L362.98 306.52 339.49 279.24 339.49 326.8Z
M362.98 306.52L362.98 258.96 339.49 279.24 362.98 306.52Z
M362.98 306.52L418.06 258.96 362.98 258.96 362.98 306.52Z
M509.28 341.02L509.28 293.47 454.2 341.02 509.28 341.02Z
M509.28 341.02L516.41 334.87 509.28 293.47 509.28 341.02Z
M516.41 334.87L516.41 287.32 509.28 293.47 516.41 334.87Z
M516.41 334.87L543.54 311.45 516.41 287.32 516.41 334.87Z
M543.54 311.45L543.54 300.69 516.41 287.32 543.54 311.45Z
M543.54 311.45L549.25 306.52 543.54 300.69 543.54 311.45Z
M549.25 306.52L549.25 303.51 543.54 300.69 549.25 306.52Z
M549.25 266.71L549.25 258.96 543.54 263.89 549.25 266.71Z
M549.25 306.52L551.47 304.6 549.25 303.51 549.25 306.52Z
M549.25 266.71L551.47 267.8 549.25 258.96 549.25 266.71Z
M551.47 267.8L551.47 258.96 549.25 258.96 551.47 267.8Z
M551.47 267.8L578.59 281.18 551.47 258.96 551.47 267.8Z
M578.59 281.18L578.59 258.96 551.47 258.96 578.59 281.18Z
M578.59 281.18L604.33 258.96 578.59 258.96 578.59 281.18Z
M697.15 339.64L697.15 292.09 662.09 322.35 697.15 339.64Z
M697.15 339.64L735.52 306.52 697.15 292.09 697.15 339.64Z
M735.52 306.52L735.52 258.96 697.15 292.09 735.52 306.52Z
M735.52 306.52L790.6 258.96 735.52 258.96 735.52 306.52Z"
fill-rule="evenodd" fill="black"/>
<path d="M1.27 341.02L36.73 341.02 1.27 323.54 1.27 341.02Z
M201.93 295.76L201.93 258.96 127.3 258.96 201.93 295.76Z
M201.93 295.76L293.71 341.02 201.93 258.96 201.93 295.76Z
M293.71 341.02L293.71 304.22 201.93 258.96 293.71 341.02Z
M293.71 341.02L368.34 341.02 293.71 304.22 293.71 341.02Z
M533.54 295.76L533.54 258.96 458.91 258.96 533.54 295.76Z
M533.54 295.76L625.33 341.02 533.54 258.96 533.54 295.76Z
M625.33 341.02L625.33 304.22 533.54 258.96 625.33 341.02Z
M625.33 341.02L695.55 341.02 625.33 304.22 625.33 341.02Z
M695.55 341.02L695.55 338.85 625.33 304.22 695.55 341.02Z
M695.55 341.02L697.15 339.64 695.55 338.85 695.55 341.02Z
M790.6 259L790.6 258.96 790.57 258.99 790.6 259Z
M790.6 259L798.72 263.01 790.6 258.96 790.6 259Z
M798.72 263.01L798.72 258.96 790.6 258.96 798.72 263.01Z"
fill-rule="evenodd" fill="#131a46"/>
</svg>
<svg id="pattern3" class= "hidden" xmlns="http://www.w3.org/2000/svg" width="800.000" height="600.000" viewBox="0.0 0.0 800.000 600.000" version="1.1">
<path d="M1.27 341.02L97.27 341.02 1.27 258.96 1.27 341.02Z
M97.27 341.02L97.27 258.96 1.27 258.96 97.27 341.02Z
M97.27 341.02L113.11 341.02 97.27 258.96 97.27 341.02Z
M113.11 341.02L113.11 268.85 97.27 258.96 113.11 341.02Z
M113.11 341.02L170.94 304.94 113.11 268.85 113.11 341.02Z
M201.67 268.85L201.67 258.96 185.83 258.96 201.67 268.85Z
M215.22 341.02L215.22 332.57 201.67 341.02 215.22 341.02Z
M201.67 268.85L215.22 277.3 201.67 258.96 201.67 268.85Z
M215.22 277.3L215.22 258.96 201.67 258.96 215.22 277.3Z
M215.22 341.02L228.77 341.02 215.22 332.57 215.22 341.02Z
M215.22 277.3L228.77 268.85 215.22 258.96 215.22 277.3Z
M228.77 268.85L228.77 258.96 215.22 258.96 228.77 268.85Z
M228.77 268.85L244.61 258.96 228.77 258.96 228.77 268.85Z
M317.34 341.02L317.34 268.85 259.5 304.94 317.34 341.02Z
M317.34 341.02L333.18 341.02 317.34 268.85 317.34 341.02Z
M333.18 341.02L333.18 258.96 317.34 268.85 333.18 341.02Z
M333.18 341.02L497.81 341.02 333.18 258.96 333.18 341.02Z
M497.81 341.02L497.81 258.96 333.18 258.96 497.81 341.02Z
M497.81 341.02L513.65 341.02 497.81 258.96 497.81 341.02Z
M513.65 341.02L513.65 268.85 497.81 258.96 513.65 341.02Z
M513.65 341.02L571.49 304.94 513.65 268.85 513.65 341.02Z
M602.22 268.85L602.22 258.96 586.38 258.96 602.22 268.85Z
M615.77 341.02L615.77 332.57 602.22 341.02 615.77 341.02Z
M602.22 268.85L615.77 277.3 602.22 258.96 602.22 268.85Z
M615.77 277.3L615.77 258.96 602.22 258.96 615.77 277.3Z
M615.77 341.02L629.32 341.02 615.77 332.57 615.77 341.02Z
M615.77 277.3L629.32 268.85 615.77 258.96 615.77 277.3Z
M629.32 268.85L629.32 258.96 615.77 258.96 629.32 268.85Z
M629.32 268.85L645.16 258.96 629.32 258.96 629.32 268.85Z
M717.88 341.02L717.88 268.85 660.05 304.94 717.88 341.02Z
M717.88 341.02L733.72 341.02 717.88 268.85 717.88 341.02Z
M733.72 341.02L733.72 258.96 717.88 268.85 733.72 341.02Z
M733.72 341.02L798.72 341.02 733.72 258.96 733.72 341.02Z
M798.72 341.02L798.72 258.96 733.72 258.96 798.72 341.02Z"
fill-rule="evenodd" fill="#54ad51"/>
<path d="M185.83 314.23L185.83 258.96 97.27 258.96 185.83 314.23Z
M185.83 314.23L228.77 341.02 185.83 258.96 185.83 314.23Z
M228.77 341.02L228.77 285.76 185.83 258.96 228.77 341.02Z
M228.77 341.02L317.34 341.02 228.77 285.76 228.77 341.02Z
M586.38 314.23L586.38 258.96 497.81 258.96 586.38 314.23Z
M586.38 314.23L629.32 341.02 586.38 258.96 586.38 314.23Z
M629.32 341.02L629.32 285.76 586.38 258.96 629.32 341.02Z
M629.32 341.02L717.88 341.02 629.32 285.76 629.32 341.02Z"
fill-rule="evenodd" fill="#fc6e00"/>
<path d="M170.94 341.02L170.94 304.94 113.11 341.02 170.94 341.02Z
M170.94 341.02L201.67 341.02 170.94 304.94 170.94 341.02Z
M201.67 341.02L201.67 324.11 170.94 304.94 201.67 341.02Z
M201.67 341.02L215.22 332.57 201.67 324.11 201.67 341.02Z
M244.61 295.65L244.61 258.96 215.22 277.3 244.61 295.65Z
M244.61 295.65L259.5 304.94 244.61 258.96 244.61 295.65Z
M259.5 304.94L259.5 258.96 244.61 258.96 259.5 304.94Z
M259.5 304.94L333.18 258.96 259.5 258.96 259.5 304.94Z
M571.49 341.02L571.49 304.94 513.65 341.02 571.49 341.02Z
M571.49 341.02L602.22 341.02 571.49 304.94 571.49 341.02Z
M602.22 341.02L602.22 324.11 571.49 304.94 602.22 341.02Z
M602.22 341.02L615.77 332.57 602.22 324.11 602.22 341.02Z
M645.16 295.65L645.16 258.96 615.77 277.3 645.16 295.65Z
M645.16 295.65L660.05 304.94 645.16 258.96 645.16 295.65Z
M660.05 304.94L660.05 258.96 645.16 258.96 660.05 304.94Z
M660.05 304.94L733.72 258.96 660.05 258.96 660.05 304.94Z"
fill-rule="evenodd" fill="#fc777a"/>
</svg>
<svg id="pattern4" class="hidden" xmlns="http://www.w3.org/2000/svg" width="800.000" height="600.000" viewBox="0.0 0.0 800.000 600.000" version="1.1">
<path d="M1.32 341.04L1.32 335.54 1.32 341.04 1.32 341.04Z
M1.32 341.04L43.77 341.04 1.32 335.54 1.32 341.04Z
M43.77 341.04L43.77 304.66 1.32 335.54 43.77 341.04Z
M43.77 341.04L106.55 295.36 43.77 304.66 43.77 341.04Z
M106.55 295.36L106.55 258.98 43.77 304.66 106.55 295.36Z
M106.55 295.36L156.56 258.98 106.55 258.98 106.55 295.36Z
M287.23 341.04L287.23 301.78 233.27 341.04 287.23 341.04Z
M287.23 341.04L346.06 298.24 287.23 301.78 287.23 341.04Z
M346.06 298.24L346.06 258.98 287.23 301.78 346.06 298.24Z
M346.06 298.24L398.17 260.33 346.06 258.98 346.06 298.24Z
M398.17 260.33L398.17 258.98 346.06 258.98 398.17 260.33Z
M400.02 341.04L400.02 339.68 398.17 341.04 400.02 341.04Z
M398.17 260.33L400.02 258.98 398.17 258.98 398.17 260.33Z
M400.02 341.04L448.16 341.04 400.02 339.68 400.02 341.04Z
M448.16 341.04L448.16 304.66 400.02 339.68 448.16 341.04Z
M448.16 341.04L510.96 295.35 448.16 304.66 448.16 341.04Z
M510.96 295.35L510.96 258.98 448.16 304.66 510.96 295.35Z
M510.96 295.35L560.96 258.98 510.96 258.98 510.96 295.35Z
M691.63 341.04L691.63 301.78 637.66 341.04 691.63 341.04Z
M691.63 341.04L750.47 298.23 691.63 301.78 691.63 341.04Z
M750.47 298.23L750.47 258.97 691.63 301.78 750.47 298.23Z
M750.47 298.23L798.73 263.12 750.47 258.97 750.47 298.23Z
M798.73 263.12L798.73 258.97 750.47 258.97 798.73 263.12Z
M798.73 263.12L798.73 263.12 798.73 258.97 798.73 263.12Z"
fill-rule="evenodd" fill="#54ad51"/>
<path d="M156.56 341.04L156.56 258.98 43.77 341.04 156.56 341.04Z
M156.56 341.04L233.27 341.04 156.56 258.98 156.56 341.04Z
M233.27 341.04L233.27 258.98 156.56 258.98 233.27 341.04Z
M233.27 341.04L346.06 258.98 233.27 258.98 233.27 341.04Z
M560.96 341.04L560.96 258.98 448.16 341.04 560.96 341.04Z
M560.96 341.04L637.66 341.04 560.96 258.98 560.96 341.04Z
M637.66 341.04L637.66 258.97 560.96 258.98 637.66 341.04Z
M637.66 341.04L750.47 258.97 637.66 258.97 637.66 341.04Z"
fill-rule="evenodd" fill="#fc777a"/>
<path d="M1.32 335.54L1.32 258.98 1.32 335.54 1.32 335.54Z
M1.32 335.54L106.55 258.98 1.32 258.98 1.32 335.54Z
M398.17 341.04L398.17 260.33 287.23 341.04 398.17 341.04Z
M398.17 341.04L400.02 339.68 398.17 260.33 398.17 341.04Z
M400.02 339.68L400.02 258.98 398.17 260.33 400.02 339.68Z
M400.02 339.68L510.96 258.98 400.02 258.98 400.02 339.68Z
M798.73 341.04L798.73 263.12 691.63 341.04 798.73 341.04Z
M798.73 341.04L798.73 341.04 798.73 263.12 798.73 341.04Z"
fill-rule="evenodd" fill="#a05983"/>
</svg>
<svg id= "cat" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="612px" height="792px" viewBox="0 0 612 792" enable-background="new 0 0 612 792" xml:space="preserve">
<g id="Color">
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M154.67,572.189c11.694-44.801,37.457-78.752,79.571-99.436
c1.001-0.491,2.283-1.733,2.318-2.668c0.441-11.583,0.675-23.174,0.974-35.242c-0.562,0-1.408-0.144-2.19,0.021
c-27.328,5.756-50.001,19.585-68.495,40.247c-22.407,25.033-35.141,54.668-40.005,87.701c-4.264,28.953-1.775,56.928,12.13,83.457
c4.575,8.729,12.509,9.526,20.541,13.044c-0.535-1.857-0.755-2.646-0.99-3.432C150.259,628.303,147.333,600.299,154.67,572.189z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M417.117,627.774c1.797,5.054,3.238,9.263,4.821,13.418
c0.308,0.81,1.133,1.976,1.778,2.016c5.037,0.312,10.15,0.705,14.533-2.316c-1.164-4.716-2.221-8.998-3.237-13.117
C429.01,627.774,423.278,627.774,417.117,627.774z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M522.734,589.071c4.696,2.215,9.243,4.361,14.243,6.72
c-1.603-5.592-3.062-10.687-4.663-16.269C528.741,583.084,525.723,586.093,522.734,589.071z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M413.546,628.981c-0.938-0.754-2.41-1.169-3.644-1.183
c-15.639-0.178-30.715-3.59-45.645-7.826c-5.526-1.568-10.989-3.363-17.023-5.222c-0.722,4.188-1.536,7.741-1.919,11.341
c-1.799,16.882,7.762,29.423,24.616,32.202c1.648,0.272,3.483-0.586,6.367-1.137c-10.31-7.536-13.24-12.18-11.758-17.434
c6.243,11.354,10.978,14.263,19.414,11.932c7.314-2.021,9.01-6.55,8.785-21.983c1.541,3.492,3.295,7.187,3.19,10.827
c-0.112,3.912-1.969,7.773-3.063,11.657c13.635,2.746,19.439-4.644,14.782-18.816c0.376-0.244,0.753-0.488,1.129-0.732
c0.997,2.313,2.335,4.544,2.922,6.958c1.282,5.276-0.094,10.058-4.703,14.497c5.836,0.227,9.516-1.299,11.339-5.938
C420.045,643.778,417.086,631.829,413.546,628.981z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M245.198,516.038c-3.052-13.343-6.188-27.054-9.458-41.349
c-2.221,0.988-4.985,1.995-7.539,3.389c-22.998,12.554-40.186,31.326-53.695,53.162c-24.813,40.108-26.223,82.832-11.456,126.756
c0.433,1.288,1.397,3.027,2.483,3.363c7.23,2.233,14.56,4.143,21.778,6.135C172.948,603.274,190.658,552.53,245.198,516.038z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M202.112,651.056c1.656,2.105,3.311,4.21,4.967,6.315
c0.44-0.196,0.88-0.393,1.32-0.589c-1.566-21.483,2.146-41.867,12.684-60.626c10.5-18.692,26.14-32.407,43.816-43.266
c-6.234-11.345-12.208-22.215-18.508-33.681c-1.343,0.68-2.733,1.234-3.966,2.03c-17.25,11.131-31.229,25.728-40.936,43.564
c-16.469,30.267-20.912,62.405-11.452,96.09c1.591,5.665,4.218,8.371,10.017,8.639c5.124,0.235,10.222,1.04,16.106,1.678
c-5.773-7.054-10.614-12.97-15.456-18.885C201.173,651.902,201.643,651.479,202.112,651.056z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M258.542,664.039c0.327-14.648,6.487-27.003,19.694-34.926
c5.357-3.213,10.591-6.631,15.88-9.956c-0.244-0.478-0.487-0.956-0.731-1.434c-11.036-1.36-20.565,3.479-30.291,7.639
c7.655-6.732,16.677-11.2,26.657-10.566c12.804,0.814,21.069-7.585,32.005-12.266c-5.072-3.367-9.919-5.61-13.477-9.15
c-7.426-7.391-14.474-5.959-23.09-1.982c-36.907,17.031-51.31,49.158-46.77,87.864c0.167,1.428,1.236,3.268,2.437,3.97
c6.984,4.081,14.134,7.88,22.226,12.321c-0.459-1.88-0.648-2.449-0.733-3.033C260.973,683.025,258.331,673.5,258.542,664.039z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M247.356,619.943c11.554-17.822,28.91-27.753,48.325-35.019
c-10.544-9.465-20.653-18.54-30.762-27.614c0.664-0.733,1.327-1.468,1.99-2.202c-0.602,0.24-1.236,0.421-1.8,0.73
c-37.417,20.604-57.811,59.956-53.065,102.693c0.232,2.092,1.346,4.608,2.896,5.938c5.9,5.062,12.148,9.719,19.494,15.492
C233.536,657.653,235.811,637.754,247.356,619.943z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M329.831,606.703c-4.02-1.774-8.82,0.212-9.503,4.128
c-5.41,31.043,3.59,54.463,35.16,65.794c1.148,0.412,3.177,0.339,3.912-0.394c4.076-4.062,7.879-8.397,12.572-13.506
c-11.794-3.227-21.717-6.772-26.906-17.412c-5.107-10.47-2.148-21.108-0.584-31.646
C339.391,611.232,334.668,608.839,329.831,606.703z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M530.651,626.007c2.799,11.743,1.403,22.792-4.152,33.433
c-5.396,10.335-13.275,18.188-24.214,24.309c17.478-1.179,37.744-19.534,39.963-35.315c0.157-1.126,0.211-2.366-0.092-3.439
C540.104,637.72,536.634,631.25,530.651,626.007z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M521.045,591.663c-0.773-0.009-1.674,0.259-2.308,0.697
c-3.104,2.146-6.139,4.394-8.468,6.077c11.34,13.41,22.487,26.593,33.699,39.853c1.44-10.509-0.281-20.942-3.072-31.25
C539.101,600.411,527.814,591.743,521.045,591.663z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M524.317,656.188c5.762-12.831,6.732-25.924-1.843-37.949
c-4.01-5.622-9.393-10.286-14.339-15.196c-0.731-0.725-2.659-0.82-3.721-0.406c-0.578,0.227-1.003,2.336-0.639,3.255
c3.52,8.869,2.392,17.688-0.242,26.417c-7.483,24.797-30.671,36.566-53.372,26.92c0.129,14.082,8.676,23.267,23.433,25.636
C493.296,688.026,515.593,675.616,524.317,656.188z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M434.648,667.604c-19.312,6.16-39.003,5.808-58.83,3.312
c-2.103-0.265-5.118-0.304-6.363,0.921c-4.328,4.26-8.062,9.122-12.685,14.527c32.796,7.019,63.027,0.954,92.524-12.05
c-1.04-4.147-1.908-7.608-2.823-11.255C442.365,664.651,438.578,666.352,434.648,667.604z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M451.433,655.97c5.547,4.519,12.01,5.374,18.843,4.014
c23.42-4.662,32.872-27.011,32.787-42.242c-0.022-4.105-1.227-8.204-1.885-12.283c-10.895,4.635-20.47,9.3-30.454,12.792
c-10.114,3.537-20.634,5.915-30.923,8.787c1.169,14.367,9.002,21.744,18.074,16.698c-4.962-3.914-8.536-8.485-7.314-15.274
c2.856,6.173,4.749,13.352,13.631,12.851c4.353-0.246,8.481-1.333,10.146-6.294c-4.865-1.364-9.703-2.368-11.423-7.943
c4.915,4.039,10.283,5.566,16.271,3.312c6.72-2.528,7.668-8.189,6.723-15.466c3.049,4.474,5.428,7.965,8.503,12.477
c-2.147,5.897-11.534,2.561-15.254,8.496c1.995,1.528,3.858,2.957,5.723,4.385c-0.023,0.49-0.048,0.98-0.071,1.47
c-5.82,1.123-11.641,2.246-17.888,3.451c1.16,2.367,1.8,3.673,2.889,5.897c-3.44-0.201-6.057-0.356-8.673-0.506
c-2.698-0.154-5.413-0.533-8.088-0.348c-1.198,0.083-3.068,1.138-3.274,2.057C449.533,653.37,450.454,655.173,451.433,655.97z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M317.864,608.962c-9.601,6.076-18,11.287-26.239,16.738
c-1.021,0.676-1.582,2.6-1.695,3.999c-0.577,7.105-1.549,14.254-1.258,21.342c0.948,23.042,12.462,39.446,32.849,49.734
c1.654,0.835,4.599,1.08,5.986,0.159c9.188-6.1,18.115-12.593,28.423-19.872C322.098,667.596,312.111,643.053,317.864,608.962z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M285.474,629.689c-4.848,4.655-9.696,9.311-14.136,13.575
c1.618-2.844,3.594-6.316,5.57-9.788c-0.328-0.234-0.655-0.469-0.982-0.702c-2.915,3.731-6.409,7.147-8.644,11.25
c-9.313,17.094-6.545,34.373,0.122,51.51c0.384,0.987,1.872,1.855,3.017,2.186c7.821,2.251,15.588,4.894,23.568,6.328
c7.696,1.384,15.623,1.433,24.952-0.841C288.809,686.579,283.518,660.284,285.474,629.689z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M394.16,663.528c-0.993,0.776-2.742,0.586-4.146,0.837
c-0.235-1.333-0.519-2.659-0.694-4c-0.234-1.781-0.385-3.574-0.57-5.363c-3.101,3.566-5.621,6.466-8.143,9.365
c-0.413-0.312-0.827-0.624-1.241-0.937c-0.225-1.628-0.45-3.256-0.826-5.978c-2.242,3.751-3.87,6.473-5.807,9.711
c16.131,2.558,31.535,3.079,46.852,0.76c7.646-1.158,15.076-3.853,22.522-6.122c1.561-0.476,3.797-2.031,3.925-3.273
c0.334-3.247,0.696-7.216-0.841-9.753c-2.116-3.495-5.63-6.19-10.746-3.418c-2.318,1.257-5.558,0.69-8.242,1.44
c-1.745,0.487-3.965,1.472-4.729,2.898c-3.909,7.291-11.448,9.593-17.774,13.556c-0.307,0.191-0.919-0.106-1.935-0.257
c0.239-2.234,0.436-4.068,0.776-7.255C399.122,658.978,396.804,661.461,394.16,663.528z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M145.789,263.354c13.344,12.855,29.07,22.349,47.741,25.448
c4.692,0.778,10.361,0.766,14.448-1.218c4.806-2.332,8.377-7.207,12.507-11c-81.986-39.392-79.964-148.229-13.875-189.52
c-2.815,0.35-4.896,0.45-6.907,0.881c-21.408,4.589-41.058,13.397-59.264,25.385c-5.482,3.609-11.852,7.253-15.142,12.543
c-9.06,14.566-14.25,30.902-15.037,48.12C108.661,208.997,120.586,239.073,145.789,263.354z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M275.843,110.301c-47.082,13.406-77.458,58.874-69.425,103.478
c4.241,23.548,16.136,42.268,38.639,52.408c4.728,2.13,10.717,1.457,16.125,2.08c25.394,2.925,46.609,15.095,66.295,30.378
c3.857,2.995,6.64,2.91,10.014-0.096c24.818-22.111,39.262-49.192,39.892-84.204c-0.189-2.728-0.244-6.743-0.775-10.694
c-5.566-41.427-27.104-72.584-61.608-95.299c-1.563-1.029-3.687-1.618-5.573-1.682
C298.075,106.287,286.912,107.148,275.843,110.301z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M430.93,378.571c-0.222-0.496-0.442-0.992-0.663-1.488
c-5.656,2.658-11.312,5.317-18.012,8.466C422.085,389.229,425.5,381.702,430.93,378.571z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M163.191,200.127c6.274,29.531,23.611,51.91,48.999,68.369
c9.726,6.306,18.485,4.81,27.549-0.131c-4.11-3.057-8.562-5.77-12.303-9.247c-21.265-19.769-29.769-44.064-24.426-72.701
c5.152-27.613,18.917-49.77,42.794-65.274c18.261-11.857,38.046-18.044,59.988-16.754c0.143-0.408,0.285-0.817,0.429-1.226
c-2.017-0.979-3.998-2.039-6.055-2.925c-26.47-11.403-54.231-15.632-82.883-14.751c-1.768,0.055-3.765,0.482-5.225,1.412
c-6.01,3.827-12.659,7.105-17.625,12.042C166.173,127.031,154.876,160.988,163.191,200.127z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M119.73,342.181c-20.064-8.075-36.085-21.562-47.443-40.309
c-0.423,0.177-0.846,0.354-1.27,0.53c0,13.612-0.083,27.225,0.112,40.834c0.022,1.566,1.344,3.321,2.474,4.636
c13.781,16.03,31.125,26.261,51.537,31.476c7.245,1.852,14.24,2.529,21.188-1.479c3.262-1.881,7.094-3.644,10.746-3.82
c13.099-0.631,17.712-9.617,21.256-20.074c1.114-3.287,2.516-6.476,4.166-10.676C160.481,353.367,139.818,350.265,119.73,342.181z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M122.93,603.988c-3.545-32.464,2.236-63.539,16.387-92.673
c19.939-41.05,50.628-69.673,96.771-79.122c1.688-0.346,3.981-2.745,4.175-4.4c0.487-4.164,1.505-9.575-0.547-12.439
c-3.711-5.182-1.532-9.682-0.904-15.141c-2.178,0.27-4.156,0.268-5.989,0.781c-9.609,2.696-19.331,5.096-28.736,8.389
c-22.264,7.794-42.71,19.034-59.103,36.194c-32.36,33.874-49.531,74.11-48.327,121.429c0.591,23.236,6.194,45.111,19.287,64.662
c4.813,7.188,10.805,13.091,19.704,16.938c-0.634-1.549-0.874-2.305-1.236-2.996C127.575,632.565,124.51,618.457,122.93,603.988z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M490.412,420.497c-0.354-5.977-0.686-11.545-1.017-17.113
c-0.493,0.037-0.985,0.074-1.479,0.11c-1.231,5.575-2.462,11.15-3.754,17.003C486.101,420.497,487.803,420.497,490.412,420.497z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M479.703,415.26c-7.438,1.87-14.281,3.591-21.6,5.431
c7.688,0,14.573,0.066,21.455-0.086c0.847-0.019,2.215-1.071,2.411-1.873c1.374-5.614,2.644-11.266,3.56-16.968
c0.137-0.848-1.988-3.045-2.671-2.889c-9.158,2.093-16.979,6.969-24.748,11.925C465.712,410.492,473.011,410.093,479.703,415.26z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M436.606,421.634c1.594-1.493,3.381-2.357,3.733-3.622
c3.438-12.314,5.015-24.731,1.552-37.385c-1.073-3.921-3.224-4.373-6.177-2.421c-4.101,2.712-8.021,5.698-12.822,9.144
C436.355,395.839,432.205,409.926,436.606,421.634z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M75.977,442.473c-4.164-3.787-8.293-7.544-13.151-11.963
c-2.747,17.857-5.419,35.227-8.092,52.595c0.321,0.055,0.643,0.108,0.964,0.162C62.507,469.568,69.316,455.87,75.977,442.473z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M91.167,630.295c-21.366-26.573-29.413-57.817-26.485-90.773
c3.754-42.268,21.306-79.47,50.484-110.587c21.582-23.015,46.855-40.351,78.378-46.949c5.629-1.178,11.369-1.828,18.12-2.889
c-1.698-0.674-2.401-1.072-3.155-1.234c-19.106-4.121-37.994-4.049-56.53,2.942c-25.205,9.505-43.833,27.25-60.102,47.941
C75.16,450.01,63.051,473.852,53.195,498.88c-10.693,27.155-13.364,54.911-4.223,83.033c6.668,20.513,17.235,38.631,35.547,51.069
c4.193,2.849,9.204,4.493,13.839,6.691c0.264-0.474,0.527-0.946,0.791-1.42C96.474,635.613,93.507,633.205,91.167,630.295z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M95.924,533.231c6.827-37.188,24.427-68.468,51.982-93.997
c24.149-22.373,53.658-34.092,85.475-40.753c4.155-0.87,8.111-2.687,12.159-4.065c-0.093-0.852-0.186-1.703-0.279-2.556
c-10.137-4.509-19.516-11.212-31.534-10.313c-14.716,1.102-29.031,4.111-42.542,10.106c-33.232,14.746-58.301,38.735-76.905,69.58
c-12.836,21.28-21.658,44.319-25.742,68.843c-4.218,25.328,0.473,49.745,10.215,73.253c5.832,14.072,13.986,26.558,27.004,35.053
c2.498,1.631,6.051,1.644,9.402,2.474c-4.647-8.98-9.441-16.485-12.579-24.63C92.207,589.3,90.728,561.537,95.924,533.231z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M73.136,297.712c13.638,22.951,33.132,38.321,59.145,44.867
c15.805,3.978,31.625,4.529,46.978-2.183c2.032-0.889,4.598-2.195,5.393-3.984c2.936-6.618,5.233-13.519,7.864-20.565
c-0.905-0.05-1.407-0.213-1.813-0.08c-12.826,4.185-25.644,3.312-38.288-0.53c-28.107-8.544-48.696-27-64.096-51.188
c-6.957-10.926-11.548-23.357-17.312-35.314c0,21.193-0.047,42.588,0.091,63.981C71.108,294.391,72.22,296.169,73.136,297.712z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M131.465,302.456c17.531,10.461,36.429,15.36,56.891,10.085
c2.466-0.636,5.639-1.533,6.867-3.383c3.083-4.646,5.241-9.906,7.765-14.913c-38.275-6.213-65.966-26.117-82.979-60.517
c-16.769-33.905-16.24-68.224-1.926-103.314c-2.354,1.323-3.493,3.428-5.094,5.085c-20.978,21.729-33.378,47.816-39.205,77.2
c-0.591,2.979-0.528,6.331,0.176,9.285C82.201,256.582,100.674,284.083,131.465,302.456z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M77.719,440.314c7.639-10.173,14.129-18.818,20.8-27.703
c-12.275-3.62-21.393-11.469-30.835-20.642c-1.308,11.396-2.521,21.729-3.634,32.074c-0.097,0.901,0.189,2.136,0.777,2.771
C68.911,431.233,73.123,435.534,77.719,440.314z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M98.127,408.463c1.638,0.529,4.277,0.547,5.429-0.419
c9.236-7.746,18.226-15.785,27.334-23.773c-23.116-4.116-42.807-15.667-59.765-34.31c-1.066,12.833-2.058,24.213-2.885,35.605
c-0.083,1.15,0.529,2.66,1.334,3.518C77.636,397.669,86.759,404.791,98.127,408.463z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M434.1,443.428c8.727,0.183,16.219,0.956,22.076,6.976
c5.611,5.768,7.123,12.973,7.189,21.805c4.727-9.72,3.112-21.126-3.051-27.109C455.285,440.216,442.26,439.09,434.1,443.428z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M277.688,531.047c5.92-7.883,10.746-14.207,15.418-20.642
c0.664-0.914,1.164-2.614,0.766-3.526c-3.092-7.092-6.423-14.078-10.183-22.181c-5.186,5.828-10.235,11.424-15.146,17.139
c-0.509,0.593-0.51,2.001-0.217,2.848C271.243,513.101,274.27,521.478,277.688,531.047z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M319.442,575.288c10.269,5.016,19.894,9.777,29.604,14.358
c0.874,0.412,2.943,0.06,3.367-0.619c4.075-6.525,7.917-13.197,11.651-19.532c-11.047-6.254-21.116-11.955-31.638-17.911
C328.395,558.946,324.277,566.462,319.442,575.288z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M290.056,430.452c-4.609,4.014-8.459,7.365-12.309,10.717
C284.137,442.416,289.903,437.21,290.056,430.452z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M267.276,499.808c5.804-6.078,12.705-10.812,15.747-17.345
c2.116-4.543-1.064-11.557-1.893-17.464c-0.044-0.317-0.225-0.616-0.659-1.756c-3.366,1.856-6.459,3.414-9.39,5.235
c-1.774,1.102-4.431,2.391-4.741,3.976C264.59,481.412,265.265,490.374,267.276,499.808z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M275.305,446.294c-3.579,6.725-6.205,13.955-9.189,20.996
c0.495,0.258,0.989,0.517,1.483,0.774c4.067-2.123,8.147-4.224,12.188-6.397c0.511-0.275,1.085-0.898,1.167-1.431
c0.831-5.425,1.566-10.864,2.465-17.275C280.127,444.225,276.266,444.487,275.305,446.294z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M434.933,578.021c-2.978,7.722-5.754,15.521-8.596,23.294
c0.105,0.607,0.211,1.214,0.317,1.82c9.216-2.463,18.44-4.897,27.636-7.436c0.868-0.24,2.06-0.995,2.254-1.733
c2.247-8.536,4.33-17.114,6.606-26.284c-9.502,2.75-17.486,4.976-25.395,7.445C436.605,575.486,435.388,576.843,434.933,578.021z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M353.308,592.101c11.086,2.828,21.788,5.603,32.531,8.211
c0.814,0.197,2.424-0.529,2.808-1.27c3.62-6.98,7.055-14.059,10.543-21.106c-11.444-2.753-22.036-5.301-32.791-7.888
C362.199,577.122,358.063,584.089,353.308,592.101z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M402.99,577.537c-0.825,0.012-1.969,1.104-2.397,1.975
c-3.364,6.835-6.591,13.737-10.595,22.169c11.122,0.318,21.346,0.646,31.571,0.831c0.746,0.014,1.897-0.845,2.209-1.575
c3.355-7.879,6.581-15.813,9.74-23.487C422.79,577.449,412.889,577.4,402.99,577.537z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M428.041,457.744c-14.321-0.053-26.338,10.864-26.646,24.206
c-0.297,12.876,11,23.538,25.051,23.644c15.11,0.112,27.684-11.156,27.742-24.865C454.244,467.661,443.024,457.799,428.041,457.744
z M412.853,492.481c-3.306-0.019-5.842-1.701-5.77-5.335c0.063-3.249,1.596-5.783,5.357-5.772c3.648,0.011,6.053,1.508,5.811,4.831
C418.465,490.811,416.25,492.499,412.853,492.481z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M463.938,568.856c-1.457,7.933-2.818,15.883-4.404,24.935
c5.252-3.144,10.246-6.027,15.117-9.105c1.639-1.035,3.992-2.375,4.266-3.893c1.474-8.167,2.396-16.433,3.654-25.756
c-6.78,4.249-12.082,7.485-17.259,10.911C464.54,566.459,464.129,567.818,463.938,568.856z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M567.614,524.189c-12.336-15.443-28.757-18.141-45.538-20.985
c4.274-0.492,8.549-0.984,12.823-1.477c-0.859-0.99-1.631-1.117-2.407-1.207c-16.176-1.871-30.633-7.771-42.686-18.839
c-6.752-6.199-12.049-13.466-12.11-23.195c-0.038-6.233,3.078-8.829,9.245-7.864c2.247,0.352,4.588,1.115,6.521,2.29
c8.819,5.358,13.258,13.635,15.203,24.79c3.316-11.238-1.487-19.328-5.765-27.776c2.07,2.572,4.141,5.144,6.916,8.59
c-1.338-11.562-8.514-17.291-17.077-21.981c0.361-0.524,0.723-1.048,1.085-1.572c6.407,2.675,12.814,5.349,19.223,8.022
c0.216-0.39,0.432-0.78,0.647-1.171c-5.281-2.865-10.322-6.399-15.912-8.411c-5.694-2.049-11.928-2.601-17.926-3.808
c0.057-0.483,0.113-0.967,0.169-1.45c7.161,0.894,14.322,1.787,21.705,2.708c-7.847-7.744-17.73-8.035-27.533-7.349
c-9.57,0.671-19.068,2.377-28.598,3.629c-0.241-0.461-0.482-0.922-0.724-1.383c7.067-3.956,14.135-7.913,21.144-11.836
c-11.385,0.736-21.72,4.714-31.286,12.767c-0.644-2.588-1.233-4.943-1.815-7.3c-1.746-7.073-3.001-14.318-5.401-21.162
c-1.68-4.789-5.823-7.713-11.162-8.319c1.521,5.231,2.946,10.137,4.372,15.041c-0.46,0.169-0.921,0.339-1.381,0.508
c-2.929-9.593-6.222-18.939-16.038-24.498c5.875,10.624,5.875,10.624,4.701,14.323c-13.947-14.125-24.297-16.34-32.425-14.19
c3.903,1.938,8.252,4.097,12.601,6.256c-0.182,0.492-0.362,0.985-0.544,1.479c-10.583-6.52-21.99-7.649-34.536-5.878
c21.908,3.493,25.362,4.745,28.531,10.43c-8.179,0.915-16.74-0.907-24.181,3.403c5.881,0.581,11.774,0.529,17.32,1.893
c5.357,1.317,6.112,5.389,2.129,9.36c-2.42,2.414-5.241,4.828-8.35,6.081c-14.34,5.781-28.461,4.287-40.808-4.623
c-8.548-6.169-15.729-14.255-23.389-21.623c-5.033-4.843-10.317-9.162-18.181-11.597c3.746,4.104,8.9,5.627,9.959,11.647
c-10.582-5.883-20.912-8.428-32.926-4.892c12.462-0.095,16.117,0.83,18.82,4.538c-30.847,3.396-38.324,6.737-41.285,19
c6.174-5.216,11.111-11.838,20.641-11.805c-17.272,14.561-20.537,19.247-17.875,25.085c8.923-14.146,22.327-21.305,38.334-24.438
c14.946-2.925,27.156,1.566,35.599,14.217c5.051,7.565,9.207,15.777,13.241,23.957c4.183,8.479,7.461,17.404,11.637,25.887
c4.08,8.285,10.237,14.775,19.064,18.388c-0.547-1.275-1.808-1.849-2.668-2.788c-5.03-5.499-7.901-11.852-7.328-19.484
c1.431-19.039,22.126-29.187,39.604-23.667c7.006,2.212,11.295,6.98,12.93,13.949c3.391,14.45-4.783,29.855-18.583,35.49
c-1.185,0.484-2.376,0.952-4.183,1.675c1.454,0.743,2.29,1.206,3.154,1.607c8.031,3.724,14.475,9.263,19.743,16.399
c1.677,2.271,4.244,4.198,6.811,5.45c20.228,9.871,41.255,9.922,62.329,3.671c22.784-6.759,43.658-5.209,62.142,11.208
c7.006,6.222,11.742,13.366,12.469,23.023c0.358,4.762,1.771,9.444,2.706,14.162c0.395,0.038,0.789,0.076,1.184,0.114
c0.464-5.281,0.929-10.563,1.393-15.845c0.274,0.007,0.55,0.014,0.824,0.021c0.292,4.147,0.584,8.296,0.938,13.335
c6.082-9.838,4.08-18.984,1.038-28.536c2.222,2.322,4.442,4.646,7.563,7.909c-3.788-11.047-11.751-16.729-20.069-22.102
c0.306-0.441,0.611-0.883,0.917-1.324C551.668,515.932,559.035,519.747,567.614,524.189z M378.123,424.914
c-4.959,2.069-9.737,4.574-15.461,7.291c8.748-14.244,26.502-21.958,41.424-18.725c10.435,2.261,15.443,15.334,9.089,24.676
c-0.984-1.457-2.054-2.706-2.76-4.136C403.768,420.557,389.698,420.082,378.123,424.914z M456.135,488.32
c-6.452,16.715-28.447,24.286-43.814,15.083c-9.146-5.477-14.604-15.403-13.146-23.909c2.034-11.875,11.74-21.906,23.586-24.253
c2.271-0.45,4.611-0.553,5.555-0.66C449.488,454.636,462.652,471.435,456.135,488.32z M462.611,477.458
c-2.95-27.484-10.77-30.704-35.024-32.401c2.774-1.658,4.532-2.938,6.469-3.829c12.229-5.625,26.95-2.021,31.541,7.885
C470.096,458.82,467.854,467.953,462.611,477.458z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M318,574.134c4.707-8.831,8.806-16.523,12.822-24.062
c-6.534-5.94-12.617-11.471-19.547-17.771c-4.531,7.753-8.838,14.97-12.909,22.317c-0.415,0.748,0.215,2.692,0.986,3.382
C305.264,563.289,311.328,568.403,318,574.134z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M294.956,554.746c5.296-8.182,9.914-15.224,14.388-22.356
c0.484-0.773,0.595-2.399,0.107-3.068c-4.483-6.16-9.137-12.196-14.121-18.77c-4.939,6.686-9.716,13.047-14.331,19.524
c-0.644,0.903-1.101,2.78-0.61,3.521C285.092,540.694,290.018,547.646,294.956,554.746z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M413.371,435.216c1.904-8.219-0.976-16.011-6.287-18.769
c-9.382-4.87-27.986-0.423-35.472,9.018c7.977-4.042,15.635-6.479,23.972-5.66C404.668,420.697,409.686,426.744,413.371,435.216z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M412.73,483.771c-1.376,0.283-2.393,2.313-3.566,3.577
c1.183,1.066,2.438,3.064,3.532,2.98c1.67-0.128,3.229-1.695,4.836-2.651c-0.041-0.673-0.082-1.346-0.122-2.019
C415.835,484.958,414.103,483.489,412.73,483.771z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M379.789,467.473c-1.46,0.316-3.451,2.144-3.584,3.487
c-0.125,1.271,1.676,2.741,3.544,5.282c0.114,0.004,0.217-0.01,0.327-0.011c1.678-2.822,3.123-4.382,3.268-6.043
C383.419,469.316,380.808,467.252,379.789,467.473z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M503.007,548.983c0.319-0.715,0.74-1.403,0.939-2.15
c0.766-2.863,1.545-5.728,2.166-8.624c1.53-7.132,1.443-7.234-7.071-10.781c1.093,7.705,2.073,14.617,3.055,21.53
C502.399,548.966,502.703,548.975,503.007,548.983z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M350.785,495.253c1.334,7.58,3.748,15.088,6.645,22.243
c2.953,7.296,9.549,10.309,17.102,11.101c2.469,0.259,4.987,0.041,7.483,0.041c-0.001-0.008-0.001-0.016-0.001-0.022
c2.992,0,6.031,0.323,8.965-0.091c2.927-0.414,5.864-1.296,8.593-2.452c5.464-2.315,8.072-7.665,6.9-13.39
c-4.014-19.596-29.231-34.295-48.229-28.112C352.472,486.448,349.725,489.229,350.785,495.253z M373.056,521.062
c2.808-1.588,5.969-2.549,9.168-3.833c1.992,1.05,3.589,1.893,5.187,2.735c-1.062,1.545-1.797,3.831-3.258,4.479
c-2.947,1.305-6.26,1.946-9.486,2.378c-1.136,0.152-3.5-1.122-3.491-1.72C371.194,523.705,371.951,521.687,373.056,521.062z
M359.537,505.302c0.536-0.986,1.846-1.956,2.93-2.108c0.796-0.111,2.54,1.091,2.556,1.739c0.103,4.304-0.004,8.631-0.423,12.913
c-0.072,0.731-1.977,1.282-3.034,1.917c-0.521-0.926-1.04-1.853-1.561-2.778c1.216-0.268,3.46-0.455,3.488-0.816
c0.268-3.426,0.159-6.882,0.159-10.329c-0.653-0.125-1.307-0.25-1.96-0.374c-0.889,1.229-1.777,2.457-2.666,3.686
C359.163,507.85,358.959,506.363,359.537,505.302z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M477.619,512.285c-20.592,6.193-40.95,6.802-61.181-1.278
c-2.966-1.185-5.892-2.471-8.327-3.495c0,3.706,0.389,7.206-0.078,10.588c-1.123,8.138-7.338,10.986-14.291,12.628
c-10.734,2.533-21.389,2.627-32.705-2.706c-3.212,8.541-6.158,16.611-9.293,24.607c-1.526,3.895-0.316,5.858,3.427,7.649
c35.846,17.139,72.206,18.677,108.701,2.849c15.308-6.639,25.91-18.942,33.602-33.671c1.31-2.508,0.56-4.15-2.228-4.749
c-3.995-0.858-8-1.673-12.941-2.701c17.308-3.002,33.133,6.431,34.227,19.906c-2.396-2.729-4.639-5.281-7.33-8.347
c-1.028,4.977-1.597,9.241-2.802,13.318c-8.571,28.985-29.232,45.696-56.872,54.692c-19.86,6.465-40.252,6.257-60.783,3.223
c-31.652-4.678-60.619-15.653-84.922-36.823c-25.994-22.642-42.224-50.568-41.701-86.046c0.291-19.697,6.534-37.276,22.682-50.083
c0.178-0.142,0.125-0.573,0.178-0.855c-1.344-0.294-2.671-0.584-4.6-1.006c12.692-4.11,28.516,3.848,29.092,14.467
c-0.492-0.633-0.777-1.034-1.098-1.404c-3.832-4.438-8.227-10.457-13.958-9.008c-6.035,1.526-7.933,8.736-9.282,14.893
c-2.269,10.353-1.243,20.562,1.559,30.609c7.962,28.553,24.794,50.92,48.369,68.44c4.162,3.094,8.707,5.672,12.788,8.303
c4.044-10.353,7.773-19.898,11.69-29.923c-6.021-6.911-9.885-15.671-11.315-25.414c-1.641-11.17,1.157-15.505,11.766-19.182
c0.235-0.081,0.376-0.435,0.665-0.79c-10.068-5.019-16.37-13.715-22.489-23.555c-0.163,2.469-0.271,4.097-0.378,5.725
c-0.224,0.027-0.446,0.055-0.669,0.082c-0.385-1.737-0.819-3.466-1.147-5.214c-2.995-15.961-9.262-30.468-18.762-43.677
c-8.455-11.755-19.001-17.563-34.076-16.067c-21.15,2.099-38.989,16.918-41.694,37.885c-6.107,47.323,6.209,89.579,37.607,125.628
c23.862,27.397,54.542,44.573,89.084,54.546c48.686,14.056,94.997,8,137.902-19.427c14.834-9.481,27.919-21.084,35.768-37.463
c6.382-13.316,4.769-23.867-5.876-33.921C519.167,509.691,499.453,505.718,477.619,512.285z M399.131,548.523
c-7.349-2.795-14.696-5.591-22.045-8.386c0.207-0.526,0.414-1.053,0.621-1.579c7.313,2.882,14.627,5.765,21.94,8.647
C399.476,547.646,399.303,548.084,399.131,548.523z M379.923,534.521c9.74-1.532,18.76,1.225,28.374,5.452
C398.279,538.048,389.101,536.284,379.923,534.521z M349.398,516.77c-7.507-7.763-15.889-16.429-21.137-21.855
C335.015,498.756,343.177,507.653,349.398,516.77z M320.309,507.615c8.67,4.619,17.34,9.237,26.01,13.856
c-0.283,0.533-0.566,1.066-0.849,1.601c-8.639-4.678-17.277-9.355-25.915-14.032C319.806,508.565,320.057,508.09,320.309,507.615z
M317.52,521.672c8.094,2.077,16.187,4.153,24.28,6.23c-0.146,0.566-0.29,1.134-0.436,1.7c-8.052-2.165-16.104-4.33-24.157-6.495
C317.312,522.629,317.416,522.15,317.52,521.672z M301.06,571.498c34.583,27.727,73.951,41.217,118.273,40.378
C374.354,614.506,334.621,601.816,301.06,571.498z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M384.439,519.785c-4.093,0.955-8.186,1.911-12.278,2.866
c0.161,0.627,0.322,1.253,0.483,1.88C377.268,526.29,382.226,524.879,384.439,519.785z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M380.734,480.527c9.211-2.328,15.16-8.789,18.794-17.259
c6.753-15.741-2.444-29.228-19.934-28.997c-7.041-0.204-13.288,2.653-18.654,7.5c-7.401,6.685-9.254,16.84-4.836,25.448
C361.542,477.814,370.776,483.044,380.734,480.527z M374.11,470.701c0.566-2.263,3.399-5.083,5.641-5.53
c3.064-0.611,5.569,1.716,5.482,5.484c-0.078,3.508-1.941,5.546-5.157,5.576c-0.05,0.085-0.099,0.16-0.149,0.247
c-0.06-0.083-0.118-0.155-0.178-0.236c-0.04-0.001-0.074,0.006-0.115,0.004C376.412,476.092,373.238,474.19,374.11,470.701z"></path>
<path fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" d="M485.379,550.887c-0.736,0.99-1.454,2.251-1.531,3.431
c-0.524,7.924-0.873,15.86-1.285,23.916c16.07-11.157,21.896-28.666,14.429-42.622
C493.172,540.614,489.225,545.713,485.379,550.887z"></path>
</g>
</svg>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script>
var _currentFill = "fill:#000";
$("#currentSvg").click(function (event) {
$(event.target).attr('style', _currentFill);
})
var $swatches = $("#swatches");
$swatches.click(function (event) {
$swatch = $(event.target);
loc = [$swatch.attr('x'), $swatch.attr('y')]
$("#selection", $swatches).attr('x', loc[0]);
$("#selection", $swatches).attr('y', loc[1]);
_currentFill = $swatch.attr('style'); ;
})
$("#cat").click(function (event) {
$(event.target).attr('style', _currentFill);
})
var $swatches = $("#swatches");
$swatches.click(function (event) {
$swatch = $(event.target);
loc = [$swatch.attr('x'), $swatch.attr('y')]
$("#selection", $swatches).attr('x', loc[0]);
$("#selection", $swatches).attr('y', loc[1]);
_currentFill = $swatch.attr('style'); ;
})
document.getElementById("currentSvg").innerHTML = document.getElementById("pattern1").innerHTML;
function buttonpress(value){
if(value === "1"){
document.getElementById("currentSvg").innerHTML = document.getElementById("pattern1").innerHTML;
}else if(value === "2"){
document.getElementById("currentSvg").innerHTML = document.getElementById("pattern2").innerHTML;
}else if(value === "3"){
document.getElementById("currentSvg").innerHTML = document.getElementById("pattern3").innerHTML;
}else{
document.getElementById("currentSvg").innerHTML = document.getElementById("pattern4").innerHTML;
}}
</script>
</html>