-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathmain.html
More file actions
1062 lines (1013 loc) · 115 KB
/
main.html
File metadata and controls
1062 lines (1013 loc) · 115 KB
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
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
994
995
996
997
998
999
1000
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./static/Css/main.css">
<link rel="shortcut icon" href="./static/Css/Img/logo.png" type="image/x-icon">
<link rel="stylesheet" href="./static/Css/fonts.css">
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<title>Study Zone</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<link rel="icon" type="image/png" href="tb-logo.png" id="favicon">
<!------------------------LOADER--------------------------->
<!----------------------------Chat MESS-------------------------------->
</head>
<body>
<div id="wrapper">
<!-----------------------------------MENU------------------------>
<div id="menu2" style="display: none;">
<a href="home">
<div class="menu_item">
<p>Trang Chủ</p>
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="12" viewBox="0 0 13 12" fill="none">
<path
d="M6.78167 0.0960261C6.70318 0.0340545 6.60329 0 6.5 0C6.39671 0 6.29682 0.0340545 6.21833 0.0960261L0 5.01602V10.8C0 11.1183 0.136964 11.4235 0.380761 11.6485C0.624558 11.8736 0.955219 12 1.3 12H4.76667C4.88159 12 4.99181 11.9579 5.07308 11.8828C5.15435 11.8078 5.2 11.7061 5.2 11.6V9.20001C5.2 8.88175 5.33696 8.57652 5.58076 8.35148C5.82456 8.12644 6.15522 8.00001 6.5 8.00001C6.84478 8.00001 7.17544 8.12644 7.41924 8.35148C7.66304 8.57652 7.8 8.88175 7.8 9.20001V11.6C7.8 11.7061 7.84565 11.8078 7.92692 11.8828C8.00819 11.9579 8.11841 12 8.23333 12H11.7C12.0448 12 12.3754 11.8736 12.6192 11.6485C12.863 11.4235 13 11.1183 13 10.8V5.01602L6.78167 0.0960261Z"
fill="#EFF1F5" />
</svg>
</div>
</a>
<a href="index.html">
<div class="menu_item">
<p>Coding</p>
<svg xmlns="http://www.w3.org/2000/svg" width="10" height="12" viewBox="0 0 10 12" fill="none">
<path
d="M3.32402 1.14286V0H6.67598V1.14286H3.32402ZM3.84078 7.65714L3.11452 6.28571H0C0.139665 5 0.684357 3.91657 1.63408 3.03543C2.5838 2.15429 3.70577 1.7139 5 1.71429C5.57728 1.71429 6.13128 1.80952 6.66201 2C7.19274 2.19048 7.69087 2.46667 8.15642 2.82857L8.93855 2.02857L9.72067 2.82857L8.93855 3.62857C9.2365 4.02857 9.47393 4.4501 9.65084 4.89314C9.82775 5.33619 9.94413 5.80038 10 6.28571H7.56983L6.11732 3.57143L3.84078 7.65714ZM5 12C3.70577 12 2.5838 11.5594 1.63408 10.6783C0.684357 9.79714 0.139665 8.71391 0 7.42857H2.43017L3.88268 10.1429L6.15922 6.05714L6.88547 7.42857H10C9.86034 8.71429 9.31788 9.79771 8.37263 10.6789C7.42737 11.56 6.30317 12.0004 5 12Z"
fill="#EFF1F5" />
</svg>
</div>
</a>
<a href="">
<div class="menu_item">
<p>Nhập Lệnh</p>
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 15 15" fill="none">
<path
d="M10.2981 1.87754C10.4025 1.88691 10.4481 2.01441 10.3731 2.08879L5.17314 7.28879C5.11439 7.34757 5.07233 7.4209 5.05126 7.50129L4.42626 9.89504C4.40563 9.97414 4.40604 10.0573 4.42747 10.1362C4.44889 10.2151 4.49057 10.287 4.54838 10.3448C4.60619 10.4026 4.67811 10.4443 4.75701 10.4657C4.8359 10.4871 4.91903 10.4875 4.99814 10.4669L7.39126 9.84191C7.4717 9.82064 7.54504 9.77836 7.60376 9.71941L12.8775 4.44566C12.894 4.42872 12.915 4.41687 12.938 4.4115C12.9611 4.40612 12.9852 4.40746 13.0075 4.41535C13.0297 4.42324 13.0493 4.43736 13.0638 4.45602C13.0783 4.47468 13.0872 4.49712 13.0894 4.52066C13.3088 6.61418 13.2962 8.72553 13.0519 10.8163C12.9125 12.0069 11.9556 12.9413 10.7694 13.0744C8.59667 13.3153 6.40398 13.3153 4.23126 13.0744C3.04439 12.9413 2.08751 12.0069 1.94814 10.8163C1.69047 8.61317 1.69047 6.38753 1.94814 4.18441C2.08751 2.99316 3.04439 2.05879 4.23126 1.92629C6.24658 1.70295 8.27948 1.68661 10.2981 1.87754Z"
fill="#EFF1F5" />
<path
d="M11.1395 2.64796C11.154 2.6334 11.1712 2.62186 11.1902 2.61398C11.2092 2.60611 11.2295 2.60205 11.2501 2.60205C11.2706 2.60205 11.291 2.60611 11.31 2.61398C11.3289 2.62186 11.3462 2.6334 11.3607 2.64796L12.2445 3.53233C12.2736 3.56162 12.29 3.60129 12.29 3.64264C12.29 3.684 12.2736 3.72367 12.2445 3.75296L7.06133 8.93733C7.04156 8.9569 7.01699 8.97092 6.99008 8.97796L5.79383 9.29046C5.76746 9.29733 5.73975 9.29719 5.71345 9.29005C5.68715 9.28291 5.66318 9.26902 5.64391 9.24975C5.62464 9.23048 5.61075 9.20651 5.6036 9.18021C5.59646 9.15391 5.59632 9.1262 5.6032 9.09983L5.9157 7.90358C5.92266 7.87664 5.93668 7.85204 5.95633 7.83233L11.1395 2.64796Z"
fill="#EFF1F5" />
</svg>
</div>
</a>
<a href="static-page.html">
<div class="menu_item">
<p>Thông Báo</p>
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="14" viewBox="0 0 13 14" fill="none">
<path
d="M6.5 14C6.94727 14.0005 7.38361 13.866 7.74835 13.6151C8.1131 13.3642 8.38813 13.0094 8.53522 12.6H4.46478C4.61187 13.0094 4.8869 13.3642 5.25165 13.6151C5.61639 13.866 6.05273 14.0005 6.5 14ZM11.5556 8.8102V5.6C11.5556 3.3481 9.9775 1.4511 7.83972 0.8806C7.62811 0.364 7.111 0 6.5 0C5.889 0 5.37189 0.364 5.16028 0.8806C3.0225 1.4518 1.44444 3.3481 1.44444 5.6V8.8102L0.211612 10.0051C0.144414 10.07 0.0911232 10.1471 0.0548061 10.2321C0.018489 10.317 -0.000136824 10.4081 7.56653e-07 10.5V11.2C7.56653e-07 11.3857 0.0760918 11.5637 0.211535 11.695C0.346978 11.8262 0.530678 11.9 0.722223 11.9H12.2778C12.4693 11.9 12.653 11.8262 12.7885 11.695C12.9239 11.5637 13 11.3857 13 11.2V10.5C13.0001 10.4081 12.9815 10.317 12.9452 10.2321C12.9089 10.1471 12.8556 10.07 12.7884 10.0051L11.5556 8.8102Z"
fill="#EFF1F5" />
</svg>
</div>
</a>
<a href="static-page.html">
<div class="menu_item">
<p>Thống Kê</p>
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="13" viewBox="0 0 15 13" fill="none">
<path
d="M13.2558 7.6375C13.2558 7.50821 13.2007 7.38421 13.1026 7.29279C13.0044 7.20136 12.8713 7.15 12.7326 7.15H10.6395C10.5008 7.15 10.3677 7.20136 10.2695 7.29279C10.1714 7.38421 10.1163 7.50821 10.1163 7.6375V12.025H9.06977V1.4625C9.06977 0.9893 9.06837 0.6825 9.03628 0.4576C9.00558 0.24635 8.95605 0.18005 8.91628 0.143C8.87651 0.10595 8.80535 0.0598001 8.5786 0.0312001C8.33651 0.00130006 8.00791 0 7.5 0C6.99209 0 6.66279 0.00130006 6.4214 0.0312001C6.19465 0.0598001 6.12349 0.10595 6.08372 0.143C6.04395 0.18005 5.99442 0.24635 5.96372 0.4576C5.93163 0.68315 5.93023 0.9893 5.93023 1.4625V12.025H4.88372V4.3875C4.88372 4.25821 4.82859 4.13421 4.73046 4.04279C4.63233 3.95136 4.49924 3.9 4.36046 3.9H2.26744C2.12867 3.9 1.99557 3.95136 1.89744 4.04279C1.79931 4.13421 1.74419 4.25821 1.74419 4.3875V12.025H0.523256C0.38448 12.025 0.251388 12.0764 0.153258 12.1678C0.0551286 12.2592 0 12.3832 0 12.5125C0 12.6418 0.0551286 12.7658 0.153258 12.8572C0.251388 12.9486 0.38448 13 0.523256 13H14.4767C14.6155 13 14.7486 12.9486 14.8467 12.8572C14.9449 12.7658 15 12.6418 15 12.5125C15 12.3832 14.9449 12.2592 14.8467 12.1678C14.7486 12.0764 14.6155 12.025 14.4767 12.025H13.2558V7.6375Z"
fill="#EFF1F5" />
</svg>
</div>
</a>
<div class="menu_item2" onclick="pop()">
<p>Rời Phòng</p>
<svg xmlns="http://www.w3.org/2000/svg" width="17" height="17" viewBox="0 0 17 17" fill="none">
<path
d="M4.25016 1.4165H10.6252C11.0009 1.4165 11.3612 1.56576 11.6269 1.83144C11.8926 2.09711 12.0418 2.45745 12.0418 2.83317V4.24984H10.6252V2.83317H4.25016V14.1665H10.6252V12.7498H12.0418V14.1665C12.0418 14.5422 11.8926 14.9026 11.6269 15.1682C11.3612 15.4339 11.0009 15.5832 10.6252 15.5832H4.25016C3.87444 15.5832 3.5141 15.4339 3.24843 15.1682C2.98275 14.9026 2.8335 14.5422 2.8335 14.1665V2.83317C2.8335 2.45745 2.98275 2.09711 3.24843 1.83144C3.5141 1.56576 3.87444 1.4165 4.25016 1.4165Z"
fill="#CAA6F9" />
<path
d="M11.3971 11.0431L12.3958 12.0418L15.9375 8.50016L12.3958 4.9585L11.3971 5.95725L13.2246 7.79183H6.375V9.2085H13.2246L11.3971 11.0431Z"
fill="#CAA6F9" />
</svg>
</div>
</div>
<script>
let menu = document.getElementById('menu2');
document.addEventListener('contextmenu', function (event) {
menu.style.display = 'block';
menu.style.top = event.y + 'px';
menu.style.left = event.x + 'px';
event.preventDefault();
})
document.addEventListener('click', function (event) {
menu.style.display = 'none';
})
</script>
<!------------------------------------MAIN---------------------------->
<nav>
<div class="box-time" onclick="bt()">
<p id="date">Thu</p>
<p id="month">March</p>
<p id="day">02</p>
<p id="time">11:29PM</p>
</div>
<div class="box-number">
<div class="b-item" id="bt1" onclick="bt1()">
<p>1</p>
</div>
<div class="b-item2" id="bt2" onclick="bt2()">
<p>2</p>
</div>
<div class="b-item3" id="bt3" onclick="bt3()">
<p>3</p>
</div>
<div class="b-item4" id="bt4" onclick="bt4()">
<p>4</p>
</div>
<div class="b-item5" id="bt5" onclick="bt5()">
<p>5</p>
</div>
<div class="b-item6" id="bt6" onclick="bt6()">
<p>6</p>
</div>
</div>
<script src="./static/Css/Js/number-window.js"></script>
<div class="box-icon" style="cursor: pointer;">
<div class="edit-box">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 15 15" fill="none"
onclick="edit_btn()">
<path
d="M10.2981 1.87754C10.4025 1.88691 10.4481 2.01441 10.3731 2.08879L5.17314 7.28879C5.11439 7.34757 5.07233 7.4209 5.05126 7.50129L4.42626 9.89504C4.40563 9.97414 4.40604 10.0573 4.42747 10.1362C4.44889 10.2151 4.49057 10.287 4.54838 10.3448C4.60619 10.4026 4.67811 10.4443 4.75701 10.4657C4.8359 10.4871 4.91903 10.4875 4.99814 10.4669L7.39126 9.84191C7.4717 9.82064 7.54504 9.77836 7.60376 9.71941L12.8775 4.44566C12.894 4.42872 12.915 4.41687 12.938 4.4115C12.9611 4.40612 12.9852 4.40746 13.0075 4.41535C13.0297 4.42324 13.0493 4.43736 13.0638 4.45602C13.0783 4.47468 13.0872 4.49712 13.0894 4.52066C13.3088 6.61418 13.2962 8.72553 13.0519 10.8163C12.9125 12.0069 11.9556 12.9413 10.7694 13.0744C8.59667 13.3153 6.40398 13.3153 4.23126 13.0744C3.04439 12.9413 2.08751 12.0069 1.94814 10.8163C1.69047 8.61317 1.69047 6.38753 1.94814 4.18441C2.08751 2.99316 3.04439 2.05879 4.23126 1.92629C6.24658 1.70295 8.27948 1.68661 10.2981 1.87754Z"
fill="#EFF1F5" />
<path
d="M11.1393 2.64796C11.1538 2.6334 11.1711 2.62186 11.1901 2.61398C11.2091 2.60611 11.2294 2.60205 11.25 2.60205C11.2705 2.60205 11.2909 2.60611 11.3098 2.61398C11.3288 2.62186 11.3461 2.6334 11.3606 2.64796L12.2443 3.53233C12.2735 3.56162 12.2899 3.60129 12.2899 3.64264C12.2899 3.684 12.2735 3.72367 12.2443 3.75296L7.06121 8.93733C7.04144 8.9569 7.01686 8.97092 6.98995 8.97796L5.79371 9.29046C5.76734 9.29733 5.73963 9.29719 5.71333 9.29005C5.68703 9.28291 5.66306 9.26902 5.64379 9.24975C5.62452 9.23048 5.61062 9.20651 5.60348 9.18021C5.59634 9.15391 5.5962 9.1262 5.60308 9.09983L5.91558 7.90358C5.92254 7.87664 5.93656 7.85204 5.9562 7.83233L11.1393 2.64796Z"
fill="#EFF1F5" />
</svg>
<div class="nav-bar-demo" style="display: none;" id="nav-bar-demo">
<div style="display: flex; justify-content: center; align-items: center; column-gap: 7px;">
<div class="search-demo">
<div class="src-text">
<input type="text" class="search-text" id="search_text" placeholder="Tìm kiếm...."
style="width: 100%; margin-left: 12px; margin-right: 12px;">
</div>
<div class="btn-search2">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 15 15"
fill="none">
<path
d="M13.0195 13.1709L9.30859 9.39033M1.88672 6.23982C1.88672 6.81904 1.9987 7.39259 2.21628 7.92772C2.43385 8.46286 2.75275 8.94909 3.15478 9.35866C3.5568 9.76823 4.03408 10.0931 4.55935 10.3148C5.08462 10.5364 5.6476 10.6505 6.21615 10.6505C6.78469 10.6505 7.34768 10.5364 7.87295 10.3148C8.39822 10.0931 8.87549 9.76823 9.27751 9.35866C9.67954 8.94909 9.99844 8.46286 10.216 7.92772C10.4336 7.39259 10.5456 6.81904 10.5456 6.23982C10.5456 5.66059 10.4336 5.08704 10.216 4.55191C9.99844 4.01678 9.67954 3.53054 9.27751 3.12097C8.87549 2.7114 8.39822 2.38651 7.87295 2.16485C7.34768 1.94319 6.78469 1.8291 6.21615 1.8291C5.6476 1.8291 5.08462 1.94319 4.55935 2.16485C4.03408 2.38651 3.5568 2.7114 3.15478 3.12097C2.75275 3.53054 2.43385 4.01678 2.21628 4.55191C1.9987 5.08704 1.88672 5.66059 1.88672 6.23982Z"
stroke="#1E1E2E" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
</div>
</div>
<div class="bell-demo">
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="13" viewBox="0 0 12 13"
fill="none">
<path
d="M6.14063 12.8013C6.52366 12.8018 6.89732 12.6807 7.20968 12.4548C7.52204 12.229 7.75757 11.9096 7.88353 11.5411H4.39772C4.52369 11.9096 4.75922 12.229 5.07157 12.4548C5.38393 12.6807 5.7576 12.8018 6.14063 12.8013ZM10.4701 8.12968V5.24004C10.4701 3.213 9.11865 1.50542 7.28792 0.991887C7.10671 0.526872 6.66387 0.199219 6.14063 0.199219C5.61738 0.199219 5.17455 0.526872 4.99333 0.991887C3.1626 1.50605 1.8112 3.213 1.8112 5.24004V8.12968L0.755437 9.20527C0.697891 9.26368 0.652254 9.33311 0.621153 9.40957C0.590052 9.48602 0.574102 9.56799 0.574219 9.65075V10.2809C0.574219 10.448 0.639381 10.6082 0.755371 10.7264C0.87136 10.8446 1.02868 10.911 1.19271 10.911H11.0885C11.2526 10.911 11.4099 10.8446 11.5259 10.7264C11.6419 10.6082 11.707 10.448 11.707 10.2809V9.65075C11.7072 9.56799 11.6912 9.48602 11.6601 9.40957C11.629 9.33311 11.5834 9.26368 11.5258 9.20527L10.4701 8.12968Z"
fill="#CAA6F9" />
</svg>
</div>
<div class="avt-demo">
<img src="./static/Css/Img/AVT.jfif" alt="">
</div>
</div>
</div>
</div>
<svg id="screen" xmlns="http://www.w3.org/2000/svg" width="13" height="11" viewBox="0 0 13 11"
fill="none" onclick="screen_f()">
<path
d="M12.1875 0H0.8125C0.365828 0 0 0.380594 0 0.845765V8.0373C0 8.50226 0.365828 8.88284 0.8125 8.88284H6.09375V10.1542H4.0625C3.83825 10.1542 3.65625 10.3437 3.65625 10.5771C3.65625 10.8105 3.83825 11 4.0625 11H8.9375C9.16175 11 9.34375 10.8105 9.34375 10.5771C9.34375 10.3437 9.16175 10.1542 8.9375 10.1542H6.90625V8.88284H12.1875C12.6342 8.88284 13 8.50225 13 8.0373V0.845765C13 0.380594 12.6342 0 12.1875 0ZM12.1875 8.0373H0.8125V0.845765H12.1875V8.0373Z"
fill="#EFF1F5" />
</svg>
<div class="mn-box-icon" id="status-icon()" onclick="status_icon()">
<svg width="134" height="16" viewBox="0 0 134 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M42.5463 5.63735C42.5332 5.52284 42.4979 5.41221 42.4424 5.31207C42.387 5.21193 42.3126 5.12432 42.2236 5.05447C40.5142 3.71383 38.4237 2.99174 36.276 3.00007C34.1282 2.99174 32.0378 3.71383 30.3284 5.05447C30.2394 5.12432 30.165 5.21193 30.1096 5.31207C30.0541 5.41221 30.0188 5.52284 30.0057 5.63735C29.9926 5.75159 30.0022 5.86739 30.034 5.97764C30.0659 6.08789 30.1192 6.19026 30.1909 6.27848L35.6301 13.0418C35.7087 13.1397 35.8074 13.2184 35.9191 13.2722C36.0308 13.326 36.1527 13.3536 36.276 13.3529C36.3989 13.3533 36.5204 13.3255 36.6317 13.2717C36.743 13.2179 36.8414 13.1394 36.9198 13.0418L42.359 6.27848C42.431 6.19044 42.4848 6.08814 42.517 5.97788C42.5492 5.86762 42.5591 5.75174 42.5463 5.63735ZM40.1002 7.73704C38.9899 6.90127 37.6507 6.45087 36.276 6.45087C34.9013 6.45087 33.5621 6.90127 32.4518 7.73704L30.8415 5.73603C32.4042 4.51315 34.3141 3.85484 36.276 3.86281C38.2379 3.85484 40.1478 4.51315 41.7105 5.73603L40.1002 7.73704Z"
fill="#EFF1F5" />
<path
d="M68.8704 4.92573L65.9577 2.18912C65.53 1.78724 64.7967 2.06792 64.7967 2.63566V6.5779L62.1556 4.09645C62.0927 4.0374 62.0181 3.99055 61.936 3.95859C61.8538 3.92662 61.7658 3.91017 61.6769 3.91017C61.588 3.91017 61.5 3.92662 61.4179 3.95859C61.3357 3.99055 61.2611 4.0374 61.1983 4.09645C61.1354 4.15551 61.0855 4.22562 61.0515 4.30279C61.0175 4.37995 61 4.46265 61 4.54618C61 4.6297 61.0175 4.7124 61.0515 4.78956C61.0855 4.86673 61.1354 4.93684 61.1983 4.9959L64.5183 8.11524L61.1983 11.2346C61.1354 11.2936 61.0855 11.3638 61.0515 11.4409C61.0175 11.5181 61 11.6008 61 11.6843C61 11.7678 61.0175 11.8505 61.0515 11.9277C61.0855 12.0049 61.1354 12.075 61.1983 12.134C61.2611 12.1931 61.3357 12.2399 61.4179 12.2719C61.5 12.3039 61.588 12.3203 61.6769 12.3203C61.7658 12.3203 61.8538 12.3039 61.936 12.2719C62.0181 12.2399 62.0927 12.1931 62.1556 12.134L64.7967 9.65259V13.5948C64.7967 14.1626 65.53 14.4496 65.9577 14.0477L68.8704 11.3048C68.9333 11.2457 68.9832 11.1756 69.0173 11.0985C69.0514 11.0213 69.0689 10.9386 69.0689 10.855C69.0689 10.7715 69.0514 10.6888 69.0173 10.6116C68.9832 10.5344 68.9333 10.4643 68.8704 10.4053L66.433 8.11524L68.8704 5.83155C69.1352 5.58277 69.1352 5.17451 68.8704 4.92573ZM66.1546 4.17938L67.431 5.37864L66.1546 6.5779V4.17938ZM67.431 10.8518L66.1546 12.0511V9.65259L67.431 10.8518Z"
fill="#EFF1F5" />
<path
d="M126.172 10.5C127.163 10.5 127.965 9.60457 127.965 8.5C127.965 7.39543 127.163 6.5 126.172 6.5C125.182 6.5 124.379 7.39543 124.379 8.5C124.379 9.60457 125.182 10.5 126.172 10.5Z"
fill="#EFF1F5" />
<path
d="M131.776 4.5H129.45C129.366 4.5 129.262 4.43938 129.181 4.34375L128.417 3.00625C128.106 2.5 127.966 2.5 127.461 2.5H124.884C124.379 2.5 124.211 2.5 123.929 3.00656L123.164 4.34375C123.102 4.41937 123.014 4.5 122.922 4.5V4C122.922 3.9337 122.899 3.87011 122.857 3.82322C122.815 3.77634 122.758 3.75 122.698 3.75H121.578C121.518 3.75 121.461 3.77634 121.419 3.82322C121.377 3.87011 121.354 3.9337 121.354 4V4.5H120.569C120.391 4.5 120.22 4.57902 120.094 4.71967C119.967 4.86032 119.897 5.05109 119.897 5.25V12.75C119.897 12.9489 119.967 13.1397 120.094 13.2803C120.22 13.421 120.391 13.5 120.569 13.5H131.776C131.954 13.5 132.125 13.421 132.251 13.2803C132.377 13.1397 132.448 12.9489 132.448 12.75V5.25C132.448 5.05109 132.377 4.86032 132.251 4.71967C132.125 4.57902 131.954 4.5 131.776 4.5ZM126.299 11.4969C125.757 11.5253 125.22 11.3701 124.758 11.0517C124.296 10.7333 123.932 10.2666 123.713 9.71295C123.493 9.15928 123.429 8.54453 123.529 7.94947C123.628 7.35442 123.887 6.8069 124.271 6.37886C124.655 5.95082 125.145 5.66228 125.679 5.55116C126.212 5.44004 126.764 5.51153 127.26 5.75624C127.756 6.00096 128.175 6.40744 128.46 6.92229C128.746 7.43714 128.885 8.03626 128.859 8.64094C128.827 9.38682 128.547 10.0926 128.074 10.6206C127.6 11.1487 126.968 11.4611 126.299 11.4969Z"
fill="#EFF1F5" />
<g clip-path="url(#clip0_621_23)">
<path
d="M96.0547 11.5211C95.9515 11.5223 95.8507 11.4936 95.7676 11.4394C95.6846 11.3853 95.624 11.3086 95.5951 11.2212C95.5662 11.1337 95.5705 11.0403 95.6075 10.9553C95.6444 10.8702 95.712 10.7982 95.7997 10.7502C96.2294 10.5136 96.5823 10.1828 96.824 9.78999C97.0658 9.39723 97.1881 8.95592 97.179 8.50906C97.17 8.06219 97.0299 7.62501 96.7725 7.24011C96.515 6.8552 96.149 6.5357 95.71 6.31272C95.6536 6.28668 95.6037 6.25082 95.5634 6.20733C95.523 6.16383 95.4931 6.11358 95.4754 6.05961C95.4576 6.00564 95.4524 5.94906 95.4601 5.89328C95.4678 5.83749 95.4882 5.78366 95.5201 5.735C95.5519 5.68635 95.5946 5.64389 95.6456 5.61018C95.6965 5.57646 95.7547 5.55219 95.8165 5.53882C95.8784 5.52545 95.9427 5.52326 96.0055 5.53238C96.0684 5.5415 96.1285 5.56174 96.1822 5.59189C96.7602 5.8876 97.2417 6.31007 97.5802 6.81833C97.9186 7.3266 98.1024 7.90341 98.1138 8.49282C98.1252 9.08223 97.9638 9.66424 97.6452 10.1824C97.3267 10.7006 96.8617 11.1373 96.2956 11.4502C96.2241 11.4928 96.1408 11.5173 96.0547 11.5211Z"
fill="#EFF1F5" fill-opacity="0.39" />
<path
d="M97.0983 13.9918C96.9925 13.9912 96.8901 13.9594 96.8073 13.9013C96.7245 13.8433 96.6662 13.7624 96.6417 13.6716C96.6172 13.5808 96.6279 13.4855 96.6722 13.4007C96.7165 13.316 96.7917 13.2468 96.8858 13.2043C97.8764 12.7736 98.7094 12.1052 99.2891 11.2759C99.8689 10.4465 100.172 9.48978 100.164 8.51538C100.155 7.54098 99.8357 6.5884 99.2418 5.76691C98.6478 4.94543 97.8034 4.28831 96.8055 3.87093C96.7479 3.8481 96.6961 3.81532 96.6532 3.77452C96.6102 3.73372 96.5769 3.68574 96.5553 3.6334C96.5337 3.58107 96.5243 3.52545 96.5275 3.46983C96.5306 3.4142 96.5464 3.35971 96.5739 3.30957C96.6014 3.25942 96.64 3.21465 96.6874 3.17788C96.7348 3.14112 96.7901 3.11312 96.85 3.09553C96.9099 3.07795 96.9731 3.07114 97.0361 3.0755C97.099 3.07986 97.1603 3.09531 97.2163 3.12093C98.3755 3.60377 99.3569 4.36511 100.048 5.31763C100.739 6.27015 101.112 7.37527 101.124 8.50623C101.136 9.6372 100.786 10.7482 100.115 11.7118C99.4438 12.6754 98.4785 13.4526 97.3297 13.9543C97.2574 13.9838 97.1778 13.9967 97.0983 13.9918Z"
fill="#EFF1F5" fill-opacity="0.39" />
<path
d="M93.6559 2.66652L89.2831 5.99986H86.4498C86.3245 5.99986 86.2044 6.04376 86.1158 6.1219C86.0273 6.20004 85.9775 6.30602 85.9775 6.41652V10.5499C85.9775 10.6604 86.0273 10.7663 86.1158 10.8445C86.2044 10.9226 86.3245 10.9665 86.4498 10.9665H89.1934L93.6606 14.3999C93.7282 14.4523 93.8113 14.4866 93.9002 14.4987C93.9891 14.5108 94.0801 14.5003 94.1625 14.4683C94.2448 14.4364 94.3151 14.3843 94.3651 14.3183C94.415 14.2523 94.4426 14.1751 94.4445 14.0957V2.96652C94.4425 2.88672 94.4145 2.80911 94.364 2.74291C94.3134 2.67672 94.2424 2.62473 94.1593 2.59313C94.0763 2.56153 93.9847 2.55164 93.8954 2.56466C93.8061 2.57767 93.723 2.61302 93.6559 2.66652Z"
fill="#EFF1F5" />
</g>
<path id="het-cuu"
d="M3.32402 3.14286V2H6.67598V3.14286H3.32402ZM3.88268 9.85714L3.26816 8.6C3.2216 8.49524 3.15177 8.41657 3.05866 8.364C2.96555 8.31143 2.86778 8.28533 2.76536 8.28571H0C0.139665 7 0.684357 5.91657 1.63408 5.03543C2.5838 4.15429 3.70577 3.7139 5 3.71429C5.57728 3.71429 6.13128 3.80952 6.66201 4C7.19274 4.19048 7.69087 4.46667 8.15642 4.82857L8.93855 4.02857L9.72067 4.82857L8.93855 5.62857C9.2365 6.02857 9.47393 6.4501 9.65084 6.89314C9.82775 7.33619 9.94413 7.80038 10 8.28571H7.5838L6.62011 6.31429C6.51769 6.09524 6.35009 5.98571 6.11732 5.98571C5.88454 5.98571 5.71695 6.09524 5.61452 6.31429L3.88268 9.85714ZM5 14C3.70577 14 2.5838 13.5594 1.63408 12.6783C0.684357 11.7971 0.139665 10.7139 0 9.42857H2.4162L3.37989 11.4C3.48231 11.619 3.64991 11.7286 3.88268 11.7286C4.11546 11.7286 4.28305 11.619 4.38547 11.4L6.11732 7.85714L6.73184 9.11429C6.7784 9.21905 6.84823 9.29771 6.94134 9.35029C7.03445 9.40286 7.13222 9.42895 7.23464 9.42857H10C9.86034 10.7143 9.31564 11.7975 8.36592 12.6783C7.4162 13.559 6.29423 13.9996 5 14Z"
fill="#EFF1F5" />
<defs>
<clipPath id="clip0_621_23">
<rect width="17" height="15" fill="white" transform="translate(85 1)" />
</clipPath>
</defs>
</svg>
</div>
</div>
<script>
function screen_f() {
var elem = document.documentElement;
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.webkitRequestFullscreen) { /* Safari */
elem.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen) { /* IE11 */
elem.msRequestFullscreen();
}
}
</script>
</nav>
<div class="big-status" id="big-status" style="display: none; opacity: 0;">
<div class="status">
<div class="avt">
<div class="box-avt">
<div class="img">
<img src="./static/Css/Img/AVT.jfif" alt="">
</div>
<div class="name">
<p id="name">MorazOrial</p>
<p id="hello">Chào Buổi Sáng!!!</p>
</div>
</div>
<div class="box-btn">
<div class="btn-item">
<svg xmlns="http://www.w3.org/2000/svg" width="11" height="11" viewBox="0 0 11 11"
fill="none">
<path
d="M5.50208 4.0023C5.11397 4.0023 4.75053 4.14491 4.47536 4.40555C4.20148 4.66618 4.04961 5.01042 4.04961 5.37801C4.04961 5.7456 4.20148 6.08984 4.47536 6.35047C4.75053 6.60988 5.11397 6.75372 5.50208 6.75372C5.89018 6.75372 6.25362 6.60988 6.5288 6.35047C6.80267 6.08984 6.95454 5.7456 6.95454 5.37801C6.95454 5.01042 6.80267 4.66618 6.5288 4.40555C6.39439 4.27727 6.23442 4.17556 6.05816 4.10634C5.88191 4.03711 5.69288 4.00175 5.50208 4.0023ZM10.8537 6.89756L10.0048 6.21032C10.0451 5.97673 10.0658 5.73823 10.0658 5.50095C10.0658 5.26368 10.0451 5.02394 10.0048 4.79158L10.8537 4.10434C10.9179 4.05235 10.9638 3.98309 10.9853 3.90579C11.0069 3.82849 11.0031 3.7468 10.9744 3.67159L10.9628 3.63962C10.7291 3.02085 10.3791 2.44729 9.92956 1.94673L9.90619 1.92091C9.85161 1.86012 9.77886 1.81642 9.69752 1.79557C9.61619 1.77472 9.5301 1.7777 9.4506 1.80411L8.39662 2.15941C8.00722 1.85698 7.57369 1.61847 7.10381 1.4525L6.90002 0.408734C6.88465 0.330104 6.84438 0.257766 6.78456 0.20133C6.72475 0.144894 6.64822 0.107033 6.56514 0.0927757L6.53009 0.0866286C5.85513 -0.028936 5.14383 -0.028936 4.46887 0.0866286L4.43382 0.0927757C4.35075 0.107033 4.27422 0.144894 4.2144 0.20133C4.15458 0.257766 4.11431 0.330104 4.09894 0.408734L3.89385 1.45742C3.42843 1.62471 2.99485 1.86264 2.61013 2.16187L1.54836 1.80411C1.46888 1.77749 1.38273 1.7744 1.30135 1.79526C1.21997 1.81612 1.14722 1.85995 1.09277 1.92091L1.0694 1.94673C0.620674 2.44782 0.270705 3.02124 0.0361935 3.63962L0.0245115 3.67159C-0.0338986 3.82527 0.0141275 3.99738 0.145226 4.10434L1.0045 4.79896C0.964264 5.03009 0.944794 5.26613 0.944794 5.49972C0.944794 5.73577 0.964264 5.97182 1.0045 6.20049L0.147822 6.8951C0.0836948 6.9471 0.0377983 7.01635 0.0162354 7.09365C-0.00532764 7.17096 -0.00153558 7.25264 0.0271074 7.32785L0.0387895 7.35982C0.273728 7.97821 0.620294 8.54989 1.072 9.05272L1.09536 9.07854C1.14995 9.13933 1.2227 9.18303 1.30403 9.20388C1.38536 9.22473 1.47145 9.22175 1.55096 9.19533L2.61273 8.83757C2.99953 9.13878 3.43047 9.37728 3.89645 9.54202L4.10153 10.5907C4.11691 10.6693 4.15718 10.7417 4.21699 10.7981C4.27681 10.8546 4.35334 10.8924 4.43642 10.9067L4.47146 10.9128C5.15306 11.029 5.85109 11.029 6.53269 10.9128L6.56774 10.9067C6.65081 10.8924 6.72734 10.8546 6.78716 10.7981C6.84697 10.7417 6.88725 10.6693 6.90262 10.5907L7.10641 9.54694C7.57628 9.37974 8.00982 9.14246 8.39921 8.84003L9.45319 9.19533C9.53267 9.22196 9.61883 9.22504 9.70021 9.20418C9.78159 9.18332 9.85434 9.1395 9.90879 9.07854L9.93215 9.05272C10.3839 8.54743 10.7304 7.97821 10.9654 7.35982L10.977 7.32785C11.0329 7.17541 10.9848 7.00452 10.8537 6.89756ZM5.50208 8.84003C4.24172 8.84003 2.36087 6.57177 2.36087 5.37801C2.36087 4.18425 4.24172 1.92091 5.50208 1.92091C6.76244 1.92091 8.67986 4.18425 8.67986 5.37801C8.67986 6.57177 6.76244 8.84003 5.50208 8.84003Z"
fill="white" />
</svg>
</div>
<div class="btn-item">
<svg xmlns="http://www.w3.org/2000/svg" width="10" height="12" viewBox="0 0 10 12"
fill="none">
<path
d="M8.125 4.2V3C8.125 2.20435 7.79576 1.44129 7.20971 0.87868C6.62366 0.316071 5.8288 0 5 0C4.1712 0 3.37634 0.316071 2.79029 0.87868C2.20424 1.44129 1.875 2.20435 1.875 3V4.2C1.37772 4.2 0.900806 4.38964 0.549175 4.72721C0.197544 5.06477 0 5.52261 0 6V10.2C0 10.6774 0.197544 11.1352 0.549175 11.4728C0.900806 11.8104 1.37772 12 1.875 12H8.125C8.62228 12 9.09919 11.8104 9.45083 11.4728C9.80246 11.1352 10 10.6774 10 10.2V6C10 5.52261 9.80246 5.06477 9.45083 4.72721C9.09919 4.38964 8.62228 4.2 8.125 4.2ZM3.125 3C3.125 2.52261 3.32254 2.06477 3.67417 1.72721C4.02581 1.38964 4.50272 1.2 5 1.2C5.49728 1.2 5.97419 1.38964 6.32583 1.72721C6.67746 2.06477 6.875 2.52261 6.875 3V4.2H3.125V3ZM8.75 10.2C8.75 10.3591 8.68415 10.5117 8.56694 10.6243C8.44973 10.7368 8.29076 10.8 8.125 10.8H1.875C1.70924 10.8 1.55027 10.7368 1.43306 10.6243C1.31585 10.5117 1.25 10.3591 1.25 10.2V6C1.25 5.84087 1.31585 5.68826 1.43306 5.57574C1.55027 5.46321 1.70924 5.4 1.875 5.4H8.125C8.29076 5.4 8.44973 5.46321 8.56694 5.57574C8.68415 5.68826 8.75 5.84087 8.75 6V10.2Z"
fill="white" />
</svg>
</div>
<div class="btn-item">
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="11" viewBox="0 0 12 11"
fill="none">
<path
d="M5.99977 0C5.75137 0 5.51315 0.0897939 5.3375 0.249628C5.16186 0.409462 5.06318 0.626244 5.06318 0.852284V5.1137C5.06318 5.33974 5.16186 5.55652 5.3375 5.71636C5.51315 5.87619 5.75137 5.96599 5.99977 5.96599C6.24817 5.96599 6.48639 5.87619 6.66203 5.71636C6.83768 5.55652 6.93635 5.33974 6.93635 5.1137V0.852284C6.93635 0.626244 6.83768 0.409462 6.66203 0.249628C6.48639 0.0897939 6.24817 0 5.99977 0ZM2.64867 1.10541C2.51356 1.12094 2.38633 1.17187 2.28246 1.252C1.57024 1.76295 0.994755 2.41434 0.599385 3.15708C0.204015 3.89983 -0.00092797 4.71455 3.15867e-06 5.53984C3.15867e-06 8.54755 2.69362 11 5.99977 11C9.30591 11 12 8.54755 12 5.53984C12 3.80417 11.1093 2.25131 9.71707 1.25158C9.645 1.19911 9.56227 1.16008 9.47362 1.13671C9.38497 1.11334 9.29213 1.10609 9.2004 1.11537C9.10867 1.12465 9.01984 1.15028 8.939 1.19079C8.85815 1.23131 8.78686 1.28592 8.72921 1.35151C8.67156 1.4171 8.62866 1.49237 8.60298 1.57305C8.5773 1.65372 8.56933 1.7382 8.57952 1.82168C8.58972 1.90515 8.61789 1.98598 8.66241 2.05955C8.70694 2.13312 8.76695 2.19799 8.83902 2.25046C9.38666 2.64169 9.82935 3.14113 10.1336 3.71101C10.4378 4.28089 10.5957 4.90627 10.5951 5.53984C10.5966 6.08938 10.4788 6.63376 10.2483 7.14172C10.0179 7.64968 9.67949 8.1112 9.25248 8.49978C8.82547 8.88836 8.31829 9.19633 7.76009 9.40601C7.20188 9.61568 6.60365 9.72292 5.99977 9.72157C5.39588 9.72292 4.79765 9.61568 4.23945 9.40601C3.68125 9.19633 3.17407 8.88836 2.74706 8.49978C2.32004 8.1112 1.98161 7.64968 1.75119 7.14172C1.52078 6.63376 1.40293 6.08938 1.40441 5.53984C1.40402 4.9063 1.56191 4.28096 1.86613 3.7111C2.17036 3.14124 2.61297 2.64177 3.16051 2.25046C3.28452 2.16569 3.37422 2.04596 3.41561 1.90993C3.457 1.77391 3.44775 1.62925 3.38931 1.49851C3.33087 1.36777 3.22652 1.25831 3.09254 1.1872C2.95856 1.11609 2.80249 1.08733 2.64867 1.10541Z"
fill="white" />
</svg>
</div>
</div>
</div>
<div class="volume">
<div class="head-phone">
<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 10 10" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M5 1C3.93913 1 2.92172 1.42143 2.17157 2.17157C1.42143 2.92172 1 3.93913 1 5V6H2C2.26522 6 2.51957 6.10536 2.70711 6.29289C2.89464 6.48043 3 6.73478 3 7V8.5C3 8.89782 2.84196 9.27936 2.56066 9.56066C2.27936 9.84196 1.89782 10 1.5 10C1.10218 10 0.720644 9.84196 0.43934 9.56066C0.158035 9.27936 0 8.89782 0 8.5V5C0 2.2385 2.2385 0 5 0C7.7615 0 10 2.2385 10 5V8.5C10 8.89782 9.84196 9.27936 9.56066 9.56066C9.27936 9.84196 8.89782 10 8.5 10C8.10218 10 7.72064 9.84196 7.43934 9.56066C7.15804 9.27936 7 8.89782 7 8.5V7C7 6.73478 7.10536 6.48043 7.29289 6.29289C7.48043 6.10536 7.73478 6 8 6H9V5C9 3.93913 8.57857 2.92172 7.82843 2.17157C7.07828 1.42143 6.06087 1 5 1Z"
fill="white" />
</svg>
<input type="range" id="progress1" min="0" max="1" step="0.1" value="1">
<svg xmlns="http://www.w3.org/2000/svg" width="6" height="9" viewBox="0 0 6 9" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M5.77093 4.01378C5.91761 4.14054 6 4.31245 6 4.49169C6 4.67094 5.91761 4.84285 5.77093 4.96961L1.34511 8.79363C1.27294 8.85819 1.18661 8.90969 1.09116 8.94512C0.995705 8.98055 0.893043 8.99919 0.789161 8.99997C0.68528 9.00075 0.582259 8.98365 0.486109 8.94966C0.38996 8.91567 0.302607 8.86548 0.229149 8.80201C0.15569 8.73854 0.0975976 8.66307 0.0582597 8.57999C0.0189218 8.49691 -0.000873164 8.4079 2.95397e-05 8.31815C0.000932243 8.22839 0.0225147 8.13969 0.0635176 8.05721C0.10452 7.97474 0.164122 7.90015 0.238846 7.8378L4.11154 4.49169L0.238846 1.14559C0.0963322 1.0181 0.0174745 0.847346 0.019257 0.670106C0.0210396 0.492866 0.10332 0.323322 0.248376 0.19799C0.393433 0.0726577 0.589659 0.00156572 0.794792 2.55538e-05C0.999925 -0.00151461 1.19755 0.0666203 1.34511 0.189756L5.77093 4.01378Z"
fill="white" fill-opacity="0.76" />
</svg>
</div>
<div class="mic">
<svg xmlns="http://www.w3.org/2000/svg" width="10" height="12" viewBox="0 0 10 12" fill="none">
<path
d="M5 7.57895C4.40476 7.57895 3.89881 7.39474 3.48214 7.02632C3.06548 6.65789 2.85714 6.21053 2.85714 5.68421V1.89474C2.85714 1.36842 3.06548 0.921053 3.48214 0.552632C3.89881 0.184211 4.40476 0 5 0C5.59524 0 6.10119 0.184211 6.51786 0.552632C6.93452 0.921053 7.14286 1.36842 7.14286 1.89474V5.68421C7.14286 6.21053 6.93452 6.65789 6.51786 7.02632C6.10119 7.39474 5.59524 7.57895 5 7.57895ZM4.28571 12V10.0579C3.04762 9.91053 2.02381 9.42105 1.21429 8.58947C0.404762 7.75789 0 6.78947 0 5.68421H1.42857C1.42857 6.55789 1.77691 7.30274 2.47357 7.91874C3.17024 8.53474 4.01238 8.84253 5 8.8421C5.9881 8.8421 6.83048 8.5341 7.52714 7.9181C8.22381 7.3021 8.57191 6.55747 8.57143 5.68421H10C10 6.78947 9.59524 7.75789 8.78571 8.58947C7.97619 9.42105 6.95238 9.91053 5.71429 10.0579V12H4.28571ZM5 6.31579C5.20238 6.31579 5.37214 6.25516 5.50929 6.13389C5.64643 6.01263 5.71476 5.86274 5.71429 5.68421V1.89474C5.71429 1.71579 5.64571 1.56568 5.50857 1.44442C5.37143 1.32316 5.2019 1.26274 5 1.26316C4.79762 1.26316 4.62786 1.32379 4.49071 1.44505C4.35357 1.56632 4.28524 1.71621 4.28571 1.89474V5.68421C4.28571 5.86316 4.35429 6.01326 4.49143 6.13453C4.62857 6.25579 4.7981 6.31621 5 6.31579Z"
fill="white" />
</svg>
<input type="range" value="0" id="progress2">
<svg xmlns="http://www.w3.org/2000/svg" width="6" height="9" viewBox="0 0 6 9" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M5.77093 4.01378C5.91761 4.14054 6 4.31245 6 4.49169C6 4.67094 5.91761 4.84285 5.77093 4.96961L1.34511 8.79363C1.27294 8.85819 1.18661 8.90969 1.09116 8.94512C0.995705 8.98055 0.893043 8.99919 0.789161 8.99997C0.68528 9.00075 0.582259 8.98365 0.486109 8.94966C0.38996 8.91567 0.302607 8.86548 0.229149 8.80201C0.15569 8.73854 0.0975976 8.66307 0.0582597 8.57999C0.0189218 8.49691 -0.000873164 8.4079 2.95397e-05 8.31815C0.000932243 8.22839 0.0225147 8.13969 0.0635176 8.05721C0.10452 7.97474 0.164122 7.90015 0.238846 7.8378L4.11154 4.49169L0.238846 1.14559C0.0963322 1.0181 0.0174745 0.847346 0.019257 0.670106C0.0210396 0.492866 0.10332 0.323322 0.248376 0.19799C0.393433 0.0726577 0.589659 0.00156572 0.794792 2.55538e-05C0.999925 -0.00151461 1.19755 0.0666203 1.34511 0.189756L5.77093 4.01378Z"
fill="white" fill-opacity="0.76" />
</svg>
</div>
<div class="music">
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none">
<g clip-path="url(#clip0_596_165)">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M2.29599 4.66664H1.74999C1.59528 4.66664 1.44691 4.7281 1.33751 4.8375C1.22811 4.94689 1.16666 5.09527 1.16666 5.24998C1.16666 5.40469 1.22811 5.55306 1.33751 5.66246C1.44691 5.77185 1.59528 5.83331 1.74999 5.83331H1.88007C1.59212 7.08735 1.77471 8.40347 2.39317 9.53176C3.01164 10.6601 4.02291 11.5219 5.23496 11.9538C6.44701 12.3856 7.77543 12.3573 8.96798 11.8742C10.1605 11.3911 11.1342 10.4869 11.704 9.33331H12.25C12.4047 9.33331 12.5531 9.27185 12.6625 9.16246C12.7719 9.05306 12.8333 8.90469 12.8333 8.74998C12.8333 8.59527 12.7719 8.44689 12.6625 8.3375C12.5531 8.2281 12.4047 8.16664 12.25 8.16664H12.1199C12.4079 6.9126 12.2253 5.59648 11.6068 4.46819C10.9883 3.3399 9.97707 2.47802 8.76502 2.04619C7.55297 1.61437 6.22455 1.64269 5.032 2.12576C3.83945 2.60883 2.86582 3.51303 2.29599 4.66664ZM3.64874 4.66664C4.20303 3.86894 5.02353 3.29497 5.96293 3.04778C6.90232 2.8006 7.89907 2.89639 8.77419 3.31797C9.64931 3.73954 10.3455 4.45928 10.7377 5.34795C11.1299 6.23662 11.1925 7.236 10.9142 8.16664H5.54166C5.4643 8.16664 5.39011 8.13591 5.33542 8.08122C5.28072 8.02652 5.24999 7.95233 5.24999 7.87498C5.24999 7.79762 5.28072 7.72343 5.33542 7.66874C5.39011 7.61404 5.4643 7.58331 5.54166 7.58331H6.70832C7.0951 7.58331 7.46603 7.42966 7.73952 7.15617C8.01301 6.88268 8.16666 6.51175 8.16666 6.12498C8.16666 5.7382 8.01301 5.36727 7.73952 5.09378C7.46603 4.82029 7.0951 4.66664 6.70832 4.66664H3.64874ZM10.3512 9.33331C9.79695 10.131 8.97645 10.705 8.03705 10.9522C7.09766 11.1994 6.10091 11.1036 5.22579 10.682C4.35067 10.2604 3.6545 9.54067 3.26229 8.652C2.87007 7.76334 2.80751 6.76396 3.08582 5.83331H6.70832C6.78568 5.83331 6.85986 5.86404 6.91456 5.91874C6.96926 5.97343 6.99999 6.04762 6.99999 6.12498C6.99999 6.20233 6.96926 6.27652 6.91456 6.33122C6.85986 6.38591 6.78568 6.41664 6.70832 6.41664H5.54166C5.15488 6.41664 4.78395 6.57029 4.51046 6.84378C4.23697 7.11727 4.08332 7.4882 4.08332 7.87498C4.08332 8.26175 4.23697 8.63268 4.51046 8.90617C4.78395 9.17966 5.15488 9.33331 5.54166 9.33331H10.3512Z"
fill="white" />
</g>
<defs>
<clipPath id="clip0_596_165">
<rect width="14" height="14" fill="white" />
</clipPath>
</defs>
</svg>
<input type="range" value="0" id="progress3">
</div>
</div>
<div class="setting">
<div class="theme">
<div class="light">
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 13 13"
fill="none">
<path
d="M5.87097 1.46774V0.629032C5.87097 0.462203 5.93724 0.302206 6.05521 0.184239C6.17317 0.0662728 6.33317 0 6.5 0C6.66683 0 6.82683 0.0662728 6.94479 0.184239C7.06276 0.302206 7.12903 0.462203 7.12903 0.629032V1.46774C7.12903 1.63457 7.06276 1.79457 6.94479 1.91253C6.82683 2.0305 6.66683 2.09677 6.5 2.09677C6.33317 2.09677 6.17317 2.0305 6.05521 1.91253C5.93724 1.79457 5.87097 1.63457 5.87097 1.46774ZM10.0645 6.5C10.0645 7.20499 9.85546 7.89416 9.46379 8.48034C9.07211 9.06652 8.51541 9.52339 7.86408 9.79318C7.21275 10.063 6.49605 10.1336 5.8046 9.99603C5.11315 9.85849 4.47801 9.519 3.97951 9.02049C3.481 8.52199 3.14151 7.88685 3.00398 7.1954C2.86644 6.50395 2.93703 5.78725 3.20682 5.13592C3.47661 4.48459 3.93348 3.92789 4.51966 3.53621C5.10584 3.14454 5.79501 2.93548 6.5 2.93548C7.44507 2.93646 8.35115 3.31231 9.01942 3.98058C9.68769 4.64885 10.0635 5.55493 10.0645 6.5ZM8.80645 6.5C8.80645 6.04383 8.67118 5.5979 8.41774 5.2186C8.16431 4.83931 7.80409 4.54369 7.38264 4.36912C6.96119 4.19455 6.49744 4.14887 6.05003 4.23787C5.60263 4.32686 5.19166 4.54653 4.86909 4.86909C4.54653 5.19166 4.32686 5.60263 4.23787 6.05003C4.14887 6.49744 4.19455 6.96119 4.36912 7.38264C4.54369 7.80409 4.83931 8.16431 5.2186 8.41774C5.5979 8.67118 6.04383 8.80645 6.5 8.80645C7.1115 8.80576 7.69775 8.56253 8.13014 8.13014C8.56253 7.69775 8.80576 7.1115 8.80645 6.5ZM2.49044 3.38052C2.54896 3.43904 2.61842 3.48545 2.69487 3.51712C2.77132 3.54878 2.85326 3.56508 2.93601 3.56508C3.01876 3.56508 3.1007 3.54878 3.17715 3.51712C3.2536 3.48545 3.32306 3.43904 3.38157 3.38052C3.44008 3.32201 3.4865 3.25255 3.51817 3.1761C3.54983 3.09965 3.56613 3.01771 3.56613 2.93496C3.56613 2.85221 3.54983 2.77027 3.51817 2.69382C3.4865 2.61737 3.44008 2.54791 3.38157 2.4894L2.75254 1.86036C2.63437 1.74219 2.47409 1.6758 2.30698 1.6758C2.13986 1.6758 1.97958 1.74219 1.86141 1.86036C1.74324 1.97853 1.67685 2.13881 1.67685 2.30593C1.67685 2.47305 1.74324 2.63332 1.86141 2.75149L2.49044 3.38052ZM2.49044 9.61843L1.86141 10.2475C1.8029 10.306 1.75648 10.3754 1.72482 10.4519C1.69315 10.5283 1.67685 10.6103 1.67685 10.693C1.67685 10.7758 1.69315 10.8577 1.72482 10.9342C1.75648 11.0106 1.8029 11.0801 1.86141 11.1386C1.97958 11.2568 2.13986 11.3231 2.30698 11.3231C2.38972 11.3231 2.47166 11.3068 2.54811 11.2752C2.62456 11.2435 2.69403 11.1971 2.75254 11.1386L3.38157 10.5096C3.49974 10.3914 3.56613 10.2311 3.56613 10.064C3.56613 9.89687 3.49974 9.7366 3.38157 9.61843C3.2634 9.50026 3.10313 9.43387 2.93601 9.43387C2.76889 9.43387 2.60861 9.50026 2.49044 9.61843ZM10.0645 3.56452C10.1471 3.56458 10.229 3.54837 10.3053 3.5168C10.3817 3.48523 10.4511 3.43892 10.5096 3.38052L11.1386 2.75149C11.1971 2.69298 11.2435 2.62352 11.2752 2.54707C11.3068 2.47062 11.3231 2.38868 11.3231 2.30593C11.3231 2.22318 11.3068 2.14124 11.2752 2.06479C11.2435 1.98834 11.1971 1.91888 11.1386 1.86036C11.0801 1.80185 11.0106 1.75544 10.9342 1.72377C10.8577 1.6921 10.7758 1.6758 10.693 1.6758C10.6103 1.6758 10.5283 1.6921 10.4519 1.72377C10.3754 1.75544 10.306 1.80185 10.2475 1.86036L9.61843 2.4894C9.52993 2.57738 9.4696 2.68969 9.44511 2.81205C9.42063 2.93442 9.43309 3.0613 9.48091 3.17656C9.52874 3.29182 9.60976 3.39025 9.71368 3.45934C9.81761 3.52842 9.93973 3.56503 10.0645 3.56452ZM10.5096 9.61948C10.3914 9.5013 10.2311 9.43492 10.064 9.43492C9.89687 9.43492 9.7366 9.5013 9.61843 9.61948C9.50026 9.73765 9.43387 9.89792 9.43387 10.065C9.43387 10.2322 9.50026 10.3924 9.61843 10.5106L10.2475 11.1396C10.3656 11.2578 10.5259 11.3242 10.693 11.3242C10.8601 11.3242 11.0204 11.2578 11.1386 11.1396C11.2568 11.0215 11.3231 10.8612 11.3231 10.6941C11.3231 10.527 11.2568 10.3667 11.1386 10.2485L10.5096 9.61948ZM2.09677 6.5C2.09677 6.33317 2.0305 6.17317 1.91253 6.05521C1.79457 5.93724 1.63457 5.87097 1.46774 5.87097H0.629032C0.462203 5.87097 0.302206 5.93724 0.184239 6.05521C0.0662728 6.17317 0 6.33317 0 6.5C0 6.66683 0.0662728 6.82683 0.184239 6.94479C0.302206 7.06276 0.462203 7.12903 0.629032 7.12903H1.46774C1.63457 7.12903 1.79457 7.06276 1.91253 6.94479C2.0305 6.82683 2.09677 6.66683 2.09677 6.5ZM6.5 10.9032C6.33317 10.9032 6.17317 10.9695 6.05521 11.0875C5.93724 11.2054 5.87097 11.3654 5.87097 11.5323V12.371C5.87097 12.5378 5.93724 12.6978 6.05521 12.8158C6.17317 12.9337 6.33317 13 6.5 13C6.66683 13 6.82683 12.9337 6.94479 12.8158C7.06276 12.6978 7.12903 12.5378 7.12903 12.371V11.5323C7.12903 11.3654 7.06276 11.2054 6.94479 11.0875C6.82683 10.9695 6.66683 10.9032 6.5 10.9032ZM12.371 5.87097H11.5323C11.3654 5.87097 11.2054 5.93724 11.0875 6.05521C10.9695 6.17317 10.9032 6.33317 10.9032 6.5C10.9032 6.66683 10.9695 6.82683 11.0875 6.94479C11.2054 7.06276 11.3654 7.12903 11.5323 7.12903H12.371C12.5378 7.12903 12.6978 7.06276 12.8158 6.94479C12.9337 6.82683 13 6.66683 13 6.5C13 6.33317 12.9337 6.17317 12.8158 6.05521C12.6978 5.93724 12.5378 5.87097 12.371 5.87097Z"
fill="white" />
</svg>
</div>
<div class="tb">
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="13" viewBox="0 0 12 13"
fill="none">
<path
d="M12 12.0588L0.731429 0L0 0.776211L2.69714 3.66102C2.38762 4.2775 2.22473 4.96599 2.22286 5.66573V9.33286L1.08 10.5552V11.1664H9.71429L11.2743 12.835L12 12.0588ZM3.36571 9.94405V5.66573C3.36571 5.2929 3.42857 4.92619 3.56 4.58392L8.57143 9.94405H3.36571ZM5.08 11.7776H7.36572C7.36572 12.1018 7.24531 12.4127 7.03098 12.642C6.81665 12.8712 6.52596 13 6.22286 13C5.91975 13 5.62906 12.8712 5.41474 12.642C5.20041 12.4127 5.08 12.1018 5.08 11.7776ZM4.10286 2.0536C4.40571 1.84579 4.73714 1.69299 5.08 1.56465V1.3874C5.08 1.06321 5.20041 0.752288 5.41474 0.523048C5.62906 0.293807 5.91975 0.165021 6.22286 0.165021C6.52596 0.165021 6.81665 0.293807 7.03098 0.523048C7.24531 0.752288 7.36572 1.06321 7.36572 1.3874V1.56465C9.06286 2.10249 10.2229 3.77104 10.2229 5.66573V8.59944L9.08 7.37706V5.66573C9.08 4.85524 8.77898 4.07795 8.24316 3.50485C7.70734 2.93174 6.98062 2.60978 6.22286 2.60978C5.77714 2.60978 5.33714 2.73202 4.94286 2.95205L4.10286 2.0536Z"
fill="#1E1E2E" />
</svg>
</div>
<div class="dark">
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 13 13"
fill="none">
<path
d="M4.72727 3.54545C4.72706 4.37277 4.94398 5.18565 5.35634 5.90287C5.7687 6.62009 6.36206 7.21653 7.07714 7.6326C7.79221 8.04866 8.60396 8.26978 9.43126 8.27386C10.2586 8.27793 11.0725 8.06482 11.7916 7.65582C11.5074 10.6541 8.98182 13 5.90909 13C2.6455 13 0 10.3545 0 7.09091C0 4.01818 2.34591 1.49264 5.34418 1.20841C4.93856 1.92042 4.7259 2.72601 4.72727 3.54545ZM1.18182 7.09091C1.18182 8.34466 1.67987 9.54706 2.5664 10.4336C3.45294 11.3201 4.65534 11.8182 5.90909 11.8182C6.74433 11.8181 7.56466 11.597 8.28672 11.1771C9.00877 10.7573 9.60681 10.1538 10.02 9.42795C9.83332 9.44568 9.64423 9.45455 9.45455 9.45455C6.19095 9.45455 3.54545 6.80904 3.54545 3.54545C3.54545 3.35577 3.55432 3.16727 3.57205 2.97995C2.8462 3.39319 2.24269 3.99123 1.82287 4.71328C1.40305 5.43534 1.18187 6.25567 1.18182 7.09091ZM9.55145 1.35377L10.0455 1.47727V2.06818L9.55145 2.19168C9.34369 2.24364 9.15395 2.35108 9.00252 2.50252C8.85108 2.65395 8.74364 2.84369 8.69168 3.05145L8.56818 3.54545H7.97727L7.85377 3.05145C7.80181 2.84369 7.69437 2.65395 7.54294 2.50252C7.3915 2.35108 7.20176 2.24364 6.994 2.19168L6.5 2.06818V1.47727L6.994 1.35377C7.20165 1.30172 7.39127 1.19424 7.54259 1.04281C7.69392 0.891379 7.80127 0.70169 7.85318 0.494L7.97727 0H8.56818L8.69168 0.494C8.74364 0.701763 8.85108 0.891502 9.00252 1.04294C9.15395 1.19437 9.34369 1.30181 9.55145 1.35377ZM12.506 4.30832L13 4.43182V5.02273L12.506 5.14623C12.2982 5.19819 12.1085 5.30563 11.9571 5.45706C11.8056 5.6085 11.6982 5.79824 11.6462 6.006L11.5227 6.5H10.9318L10.8083 6.006C10.7564 5.79824 10.6489 5.6085 10.4975 5.45706C10.346 5.30563 10.1563 5.19819 9.94855 5.14623L9.45455 5.02273V4.43182L9.94855 4.30832C10.1563 4.25636 10.346 4.14892 10.4975 3.99748C10.6489 3.84605 10.7564 3.65631 10.8083 3.44855L10.9318 2.95455H11.5227L11.6462 3.44855C11.6982 3.65631 11.8056 3.84605 11.9571 3.99748C12.1085 4.14892 12.2982 4.25636 12.506 4.30832Z"
fill="#1E1E2E" />
</svg>
</div>
</div>
<div class="box-wifi">
<div class="wifi">
<div class="set-wifi">
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="12" viewBox="0 0 14 12"
fill="none">
<path
d="M13.9939 3.05693C13.9793 2.9242 13.9399 2.79598 13.8781 2.6799C13.8163 2.56383 13.7332 2.46228 13.634 2.38131C11.7274 0.827388 9.3957 -0.00957142 7.00014 8.25881e-05C4.60458 -0.00957142 2.27291 0.827388 0.366293 2.38131C0.267045 2.46228 0.184028 2.56383 0.122191 2.6799C0.0603545 2.79598 0.0209636 2.9242 0.00636654 3.05693C-0.00830522 3.18934 0.00244516 3.32356 0.0379573 3.45135C0.0734694 3.57914 0.132993 3.69781 0.212872 3.80005L6.27971 11.6394C6.36741 11.7528 6.47752 11.844 6.6021 11.9064C6.72669 11.9688 6.86263 12.0007 7.00014 12C7.13726 12.0004 7.27275 11.9682 7.3969 11.9059C7.52106 11.8435 7.6308 11.7525 7.71825 11.6394L13.7851 3.80005C13.8654 3.69801 13.9253 3.57943 13.9612 3.45163C13.9971 3.32383 14.0083 3.18951 13.9939 3.05693ZM11.2656 5.49066C10.0272 4.52193 8.5335 3.99988 7.00014 3.99988C5.46678 3.99988 3.97309 4.52193 2.73469 5.49066L0.938559 3.17131C2.68164 1.75387 4.81187 0.990836 7.00014 1.00007C9.18842 0.990836 11.3186 1.75387 13.0617 3.17131L11.2656 5.49066Z"
fill="#1E1E2E" />
</svg>
<p class="name-wifi">VinhUni</p>
</div>
<svg xmlns="http://www.w3.org/2000/svg" width="5" height="8" viewBox="0 0 5 8" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M4.80911 3.5678C4.93134 3.68048 5 3.83329 5 3.99262C5 4.15195 4.93134 4.30475 4.80911 4.41743L1.12092 7.81656C1.06078 7.87395 0.98884 7.91973 0.909297 7.95122C0.829754 7.98271 0.744202 7.99928 0.657634 7.99998C0.571066 8.00067 0.485216 7.98547 0.405091 7.95526C0.324966 7.92504 0.252172 7.88043 0.190957 7.82401C0.129742 7.76759 0.0813313 7.7005 0.0485497 7.62666C0.0157682 7.55281 -0.000727636 7.47369 2.46164e-05 7.39391C0.000776869 7.31412 0.0187623 7.23528 0.0529313 7.16197C0.0871004 7.08866 0.136769 7.02236 0.199038 6.96693L3.42629 3.99262L0.199038 1.0183C0.0802769 0.904978 0.0145621 0.753196 0.0160475 0.59565C0.017533 0.438103 0.0860998 0.287397 0.20698 0.175991C0.327861 0.0645846 0.491383 0.00139175 0.662327 2.27145e-05C0.833271 -0.00134632 0.99796 0.0592181 1.12092 0.168672L4.80911 3.5678Z"
fill="#1E1E2E" />
</svg>
</div>
<div class="bluetooth">
<div class="set-wifi">
<svg xmlns="http://www.w3.org/2000/svg" width="9" height="13" viewBox="0 0 9 13"
fill="none">
<path
d="M7.87037 2.92573L4.95769 0.189124C4.52995 -0.212755 3.79669 0.0679222 3.79669 0.635656V4.5779L1.15558 2.09645C1.09272 2.0374 1.0181 1.99055 0.935973 1.95859C0.853844 1.92662 0.76582 1.91017 0.676925 1.91017C0.58803 1.91017 0.500005 1.92662 0.417877 1.95859C0.335748 1.99055 0.261125 2.0374 0.198266 2.09645C0.135408 2.15551 0.0855463 2.22562 0.0515276 2.30279C0.017509 2.37995 -6.62319e-10 2.46265 0 2.54618C6.6232e-10 2.6297 0.017509 2.7124 0.0515276 2.78956C0.0855463 2.86673 0.135408 2.93684 0.198266 2.9959L3.51832 6.11524L0.198266 9.23459C0.135408 9.29365 0.0855463 9.36376 0.0515276 9.44092C0.017509 9.51809 0 9.60079 0 9.68431C0 9.76783 0.017509 9.85054 0.0515276 9.9277C0.0855463 10.0049 0.135408 10.075 0.198266 10.134C0.261125 10.1931 0.335748 10.2399 0.417877 10.2719C0.500005 10.3039 0.58803 10.3203 0.676925 10.3203C0.76582 10.3203 0.853844 10.3039 0.935973 10.2719C1.0181 10.2399 1.09272 10.1931 1.15558 10.134L3.79669 7.65259V11.5948C3.79669 12.1626 4.52995 12.4496 4.95769 12.0477L7.87037 9.30476C7.93331 9.24574 7.98325 9.17565 8.01732 9.09848C8.05139 9.02131 8.06893 8.93858 8.06893 8.85504C8.06893 8.77149 8.05139 8.68877 8.01732 8.6116C7.98325 8.53443 7.93331 8.46433 7.87037 8.40532L5.43295 6.11524L7.87037 3.83155C8.13516 3.58277 8.13516 3.17451 7.87037 2.92573ZM5.15458 2.17938L6.43101 3.37864L5.15458 4.5779V2.17938ZM6.43101 8.85185L5.15458 10.0511V7.65259L6.43101 8.85185Z"
fill="#1E1E2E" />
</svg>
<p class="name-wifi">BlueTooth</p>
</div>
</div>
</div>
<div class="box-cafe">
<div class="ki-thi">
<div class="set-wifi">
<svg xmlns="http://www.w3.org/2000/svg" width="10" height="12" viewBox="0 0 10 12"
fill="none">
<path
d="M3.32402 1.14286V0H6.67598V1.14286H3.32402ZM3.88268 7.85714L3.26816 6.6C3.2216 6.49524 3.15177 6.41657 3.05866 6.364C2.96555 6.31143 2.86778 6.28533 2.76536 6.28571H0C0.139665 5 0.684357 3.91657 1.63408 3.03543C2.5838 2.15429 3.70577 1.7139 5 1.71429C5.57728 1.71429 6.13128 1.80952 6.66201 2C7.19274 2.19048 7.69087 2.46667 8.15642 2.82857L8.93855 2.02857L9.72067 2.82857L8.93855 3.62857C9.2365 4.02857 9.47393 4.4501 9.65084 4.89314C9.82775 5.33619 9.94413 5.80038 10 6.28571H7.5838L6.62011 4.31429C6.51769 4.09524 6.35009 3.98571 6.11732 3.98571C5.88454 3.98571 5.71695 4.09524 5.61452 4.31429L3.88268 7.85714ZM5 12C3.70577 12 2.5838 11.5594 1.63408 10.6783C0.684357 9.79714 0.139665 8.71391 0 7.42857H2.4162L3.37989 9.4C3.48231 9.61905 3.64991 9.72857 3.88268 9.72857C4.11546 9.72857 4.28305 9.61905 4.38547 9.4L6.11732 5.85714L6.73184 7.11429C6.7784 7.21905 6.84823 7.29771 6.94134 7.35029C7.03445 7.40286 7.13222 7.42895 7.23464 7.42857H10C9.86034 8.71429 9.31564 9.79752 8.36592 10.6783C7.4162 11.559 6.29423 11.9996 5 12Z"
fill="#1E1E2E" />
</svg>
<p class="name-wifi">Kỳ Thi</p>
</div>
<svg xmlns="http://www.w3.org/2000/svg" width="5" height="8" viewBox="0 0 5 8" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M4.80911 3.5678C4.93134 3.68048 5 3.83329 5 3.99262C5 4.15195 4.93134 4.30475 4.80911 4.41743L1.12092 7.81656C1.06078 7.87395 0.98884 7.91973 0.909297 7.95122C0.829754 7.98271 0.744202 7.99928 0.657634 7.99998C0.571066 8.00067 0.485216 7.98547 0.405091 7.95526C0.324966 7.92504 0.252172 7.88043 0.190957 7.82401C0.129742 7.76759 0.0813313 7.7005 0.0485497 7.62666C0.0157682 7.55281 -0.000727636 7.47369 2.46164e-05 7.39391C0.000776869 7.31412 0.0187623 7.23528 0.0529313 7.16197C0.0871004 7.08866 0.136769 7.02236 0.199038 6.96693L3.42629 3.99262L0.199038 1.0183C0.0802769 0.904978 0.0145621 0.753196 0.0160475 0.59565C0.017533 0.438103 0.0860998 0.287397 0.20698 0.175991C0.327861 0.0645846 0.491383 0.00139175 0.662327 2.27145e-05C0.833271 -0.00134632 0.99796 0.0592181 1.12092 0.168672L4.80911 3.5678Z"
fill="#1E1E2E" />
</svg>
</div>
<div class="cafein">
<div class="set-wifi">
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="10" viewBox="0 0 12 10"
fill="none">
<path
d="M10.4928 9.16667L7.49489 10H2.99796L0 9.16667V8.33333H10.4928V9.16667ZM11.0175 0.833333H9.74336V0H0.749489V4.16667C0.749489 5.41667 1.34908 6.5 2.24847 7V7.5H8.24438V7C8.91892 6.58333 9.44356 5.83333 9.66841 5H9.74336C11.4672 5 11.9169 3.33333 11.9918 2.08333C12.0668 1.41667 11.6171 0.833333 11.0175 0.833333ZM9.74336 4.16667V1.66667H11.0175C11.0924 1.66667 11.1674 1.75 11.1674 1.75C11.1674 1.75 11.2423 1.83333 11.2423 2C11.0924 4.16667 10.0432 4.16667 9.74336 4.16667Z"
fill="white" />
</svg>
<p class="name-cafein">Caffeine</p>
</div>
<div class="box-right-ar">
<svg xmlns="http://www.w3.org/2000/svg" width="5" height="8" viewBox="0 0 5 8"
fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M4.80911 3.5678C4.93134 3.68048 5 3.83329 5 3.99262C5 4.15195 4.93134 4.30475 4.80911 4.41743L1.12092 7.81656C1.06078 7.87395 0.98884 7.91973 0.909297 7.95122C0.829754 7.98271 0.744202 7.99928 0.657634 7.99998C0.571066 8.00067 0.485216 7.98547 0.405091 7.95526C0.324966 7.92504 0.252172 7.88043 0.190957 7.82401C0.129742 7.76759 0.0813313 7.7005 0.0485497 7.62666C0.0157682 7.55281 -0.000727636 7.47369 2.46164e-05 7.39391C0.000776869 7.31412 0.0187623 7.23528 0.0529313 7.16197C0.0871004 7.08866 0.136769 7.02236 0.199038 6.96693L3.42629 3.99262L0.199038 1.0183C0.0802769 0.904978 0.0145621 0.753196 0.0160475 0.59565C0.017533 0.438103 0.0860998 0.287397 0.20698 0.175991C0.327861 0.0645846 0.491383 0.00139175 0.662327 2.27145e-05C0.833271 -0.00134632 0.99796 0.0592181 1.12092 0.168672L4.80911 3.5678Z"
fill="white" />
</svg>
</div>
</div>
</div>
</div>
<div class="music-2">
<div class="box-show">
<svg xmlns="http://www.w3.org/2000/svg" width="33" height="32" viewBox="0 0 33 32" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M32.8565 8.66514V2.46517C32.86 2.2352 32.8111 2.00732 32.7132 1.79779C32.6153 1.58827 32.4708 1.40227 32.2901 1.25307C32.1091 1.10429 31.8961 0.996484 31.6667 0.937495C31.4372 0.878507 31.1971 0.869822 30.9637 0.912072L10.4566 1.25307C10.0729 1.30931 11.0864 4.24664 10.8357 4.53368C10.585 4.82071 10.4503 0.877127 10.4566 1.25307V20.3164C9.23654 19.634 7.81808 19.3607 6.42128 19.5388C5.02447 19.717 3.72738 20.3367 2.73118 21.3018C1.73497 22.2668 1.09532 23.5234 0.911443 24.8766C0.727564 26.2297 1.00973 27.6038 1.71417 28.7858C2.41862 29.9678 3.50597 30.8916 4.8076 31.4138C6.10922 31.9361 7.55237 32.0277 8.91321 31.6744C10.2741 31.3212 11.4765 30.5428 12.3342 29.46C13.1918 28.3771 13.6567 27.0504 13.6566 25.6856V10.4647H29.6565V17.2149C28.4365 16.5325 27.0181 16.2592 25.6214 16.4373C24.2246 16.6154 22.9276 17.235 21.9313 18.1999C20.9351 19.1649 20.2954 20.4214 20.1114 21.7745C19.9274 23.1275 20.2094 24.5016 20.9137 25.6836C21.6179 26.8656 22.7051 27.7895 24.0066 28.3119C25.308 28.8344 26.7511 28.9262 28.1119 28.5732C29.4728 28.2202 30.6754 27.4421 31.5332 26.3595C32.3911 25.2769 32.8562 23.9504 32.8565 22.5856V8.66514Z"
fill="#838188" />
</svg>
<p id="name-music">
Relax Music....
</p>
</div>
<div class="play">
<svg id="prev-play" xmlns="http://www.w3.org/2000/svg" width="18" height="10"
viewBox="0 0 18 10" fill="none">
<path d="M18 0V10L10.125 5M2.25 0V10H0V0M10.125 0V10L2.25 5" fill="#838188"
fill-opacity="0.76" />
</svg>
<svg id="play-btn-2" xmlns="http://www.w3.org/2000/svg" width="14" height="14"
viewBox="0 0 14 14" fill="none">
<path d="M13.3692 6.50428L0.349264 13.0107L0.34176 0.0129024L13.3692 6.50428Z"
fill="#D9D9D9" />
</svg>
<svg id="next-play" xmlns="http://www.w3.org/2000/svg" width="18" height="10"
viewBox="0 0 18 10" fill="none">
<path d="M0 10L0 0L7.875 5M15.75 10L15.75 0H18L18 10M7.875 10L7.875 0L15.75 5"
fill="#838188" fill-opacity="0.76" />
</svg>
</div>
</div>
<div class="tus">
<div class="pin">
<svg xmlns="http://www.w3.org/2000/svg" width="10" height="15" viewBox="0 0 10 15" fill="none">
<path
d="M2.85714 1.5V0.75C2.85714 0.551088 2.9324 0.360322 3.06635 0.21967C3.20031 0.0790176 3.38199 0 3.57143 0H6.42857C6.61801 0 6.79969 0.0790176 6.93365 0.21967C7.0676 0.360322 7.14286 0.551088 7.14286 0.75V1.5H9.28571C9.47515 1.5 9.65684 1.57902 9.79079 1.71967C9.92475 1.86032 10 2.05109 10 2.25V14.25C10 14.4489 9.92475 14.6397 9.79079 14.7803C9.65684 14.921 9.47515 15 9.28571 15H0.714286C0.524845 15 0.343164 14.921 0.20921 14.7803C0.075255 14.6397 0 14.4489 0 14.25V2.25C0 2.05109 0.075255 1.86032 0.20921 1.71967C0.343164 1.57902 0.524845 1.5 0.714286 1.5H2.85714ZM5.71429 7.5V3.75L2.14286 9H4.28571V12.75L7.85714 7.5H5.71429Z"
fill="#F8F8F8" fill-opacity="0.8" />
</svg>
<p id="pin">
99%
</p>
</div>
<div class="thong-so">
<div class="date">
<p id="date">
Thursday
</p>
</div>
<div class="day">
<p id="day">
2023. 03. 02
</p>
</div>
<div class="time">
<p id="time">
23:39
</p>
</div>
</div>
</div>
</div>
<div class="big-tb">
<div id="diem-so">
<svg xmlns="http://www.w3.org/2000/svg" width="50" height="42" viewBox="0 0 50 42" fill="none">
<path
d="M13.4375 41.3062C11.9375 41.2687 10.51 40.9222 9.155 40.2668C7.8 39.6112 6.51917 38.6452 5.3125 37.3687C3.64584 35.5687 2.34334 33.4222 1.405 30.9293C0.466671 28.4363 -0.00166223 25.8765 4.43262e-06 23.25C4.43262e-06 20.1375 0.656671 17.2125 1.97 14.475C3.28334 11.7375 5.06417 9.35625 7.3125 7.33125C9.5625 5.30625 12.2083 3.7035 15.25 2.523C18.2917 1.3425 21.5417 0.7515 25 0.75C28.4583 0.75 31.7083 1.35 34.75 2.55C37.7917 3.75 40.4375 5.38125 42.6875 7.44375C44.9375 9.50625 46.7192 11.925 48.0325 14.7C49.3458 17.475 50.0017 20.4563 50 23.6438C50 26.5312 49.4792 29.2312 48.4375 31.7437C47.3958 34.2562 45.9167 36.375 44 38.1C42.8333 39.15 41.6042 39.9473 40.3125 40.4917C39.0208 41.0363 37.7083 41.3078 36.375 41.3062C35.625 41.3062 34.875 41.2223 34.125 41.0542C33.375 40.8862 32.625 40.6328 31.875 40.2938L28.375 38.7188C27.875 38.4938 27.3433 38.325 26.78 38.2125C26.2167 38.1 25.6233 38.0438 25 38.0438C24.375 38.0438 23.7808 38.1 23.2175 38.2125C22.6542 38.325 22.1233 38.4938 21.625 38.7188L18.125 40.2938C17.3333 40.6688 16.5517 40.941 15.78 41.1105C15.0083 41.28 14.2275 41.3452 13.4375 41.3062ZM25 27.75C26.375 27.75 27.5525 27.3097 28.5325 26.4293C29.5125 25.5487 30.0017 24.489 30 23.25C30 22.95 29.9683 22.65 29.905 22.35C29.8417 22.05 29.7483 21.75 29.625 21.45L32.75 17.6812C33.2083 18.2062 33.5833 18.7403 33.875 19.2833C34.1667 19.8263 34.4167 20.3985 34.625 21C34.8333 21.6 35.1458 22.125 35.5625 22.575C35.9792 23.025 36.5208 23.25 37.1875 23.25C38.0208 23.25 38.6775 22.9215 39.1575 22.2645C39.6375 21.6075 39.7725 20.886 39.5625 20.1C38.7292 17.0625 36.9583 14.5785 34.25 12.648C31.5417 10.7175 28.4583 9.7515 25 9.75C21.5 9.75 18.4058 10.716 15.7175 12.648C13.0292 14.58 11.2692 17.064 10.4375 20.1C10.2292 20.8875 10.365 21.6097 10.845 22.2668C11.325 22.9237 11.9808 23.2515 12.8125 23.25C13.4792 23.25 14.0208 23.025 14.4375 22.575C14.8542 22.125 15.1667 21.6 15.375 21C15.9583 19.0125 17.1358 17.3902 18.9075 16.1332C20.6792 14.8763 22.71 14.2485 25 14.25C25.6667 14.25 26.3233 14.3062 26.97 14.4187C27.6167 14.5312 28.2308 14.7 28.8125 14.925L25.625 18.8062C25.5417 18.8062 25.4375 18.7965 25.3125 18.777C25.1875 18.7575 25.0833 18.7485 25 18.75C23.625 18.75 22.4475 19.191 21.4675 20.073C20.4875 20.955 19.9983 22.014 20 23.25C20 24.4875 20.49 25.5473 21.47 26.4293C22.45 27.3113 23.6267 27.7515 25 27.75Z"
fill="#CCCCD0" />
</svg>
<div class="box-text">
<p id="h-tile">
Điểm số
</p>
<p id="con-tile">
Tổng số điểm: <span id="num-tile"></span>
</p>
</div>
</div>
<div class="chua-co-tb">
<svg xmlns="http://www.w3.org/2000/svg" width="44" height="49" viewBox="0 0 44 49" fill="none">
<path
d="M22 49C23.5138 49.0019 24.9907 48.5311 26.2252 47.6529C27.4597 46.7747 28.3906 45.5329 28.8884 44.1H15.1116C15.6094 45.5329 16.5403 46.7747 17.7748 47.6529C19.0093 48.5311 20.4862 49.0019 22 49ZM39.1111 30.8357V19.6C39.1111 11.7183 33.77 5.07885 26.5344 3.0821C25.8182 1.274 24.068 0 22 0C19.932 0 18.1818 1.274 17.4656 3.0821C10.23 5.0813 4.88889 11.7183 4.88889 19.6V30.8357L0.716225 35.0178C0.488787 35.245 0.308417 35.5149 0.185498 35.8122C0.0625781 36.1095 -0.000463098 36.4282 2.56098e-06 36.75V39.2C2.56098e-06 39.8498 0.257541 40.4729 0.715964 40.9324C1.17439 41.3919 1.79614 41.65 2.44445 41.65H41.5556C42.2039 41.65 42.8256 41.3919 43.284 40.9324C43.7425 40.4729 44 39.8498 44 39.2V36.75C44.0005 36.4282 43.9374 36.1095 43.8145 35.8122C43.6916 35.5149 43.5112 35.245 43.2838 35.0178L39.1111 30.8357Z"
fill="white" fill-opacity="0.698039" />
</svg>
<p>Chưa có Thông Báo</p>
</div>
</div>
</div>
<script>
function status_icon() {
if (document.getElementById("big-status").style.display == "none") {
document.getElementById("big-status").classList.add('animation-status');
document.getElementById("big-status").style.display = "flex";
document.getElementById("big-status").style.opacity = "1";
}
else if (document.getElementById("big-status").style.display == "flex") {
document.getElementById("big-status").style.display = "none";
document.getElementById("big-status").style.opacity = "0";
}
}
</script>
<div class="time-box" id="myDiv" style="display: none;">
<p id="timer"></p>
<p id="day">
2023-03-02
</p>
</div>
<div class="music-box" id="myDiv2" style=" display: none;">
<div id="img">
</div>
<div class="name">
<p id="name_music">
Dangerous Bitch
</p>
<div id="nameauthor">
Bernnan Story
</div>
<p id="name_music_mini">
Dangerous Bitch
</p>
</div>
<svg xmlns="http://www.w3.org/2000/svg" width="99" height="52" viewBox="0 0 99 52" fill="none">
<path
d="M71.7177 0.00880537C70.8795 0.124795 70.132 0.42843 69.6073 0.865975C69.0826 1.30352 68.8147 1.84676 68.8509 2.39956V49.2771C68.7657 49.6125 68.7946 49.9559 68.9355 50.2833C69.0764 50.6108 69.326 50.9146 69.6669 51.1736C70.0078 51.4326 70.4318 51.6407 70.9097 51.7834C71.3876 51.9261 71.9078 52 72.4344 52C72.9609 52 73.4811 51.9261 73.959 51.7834C74.4369 51.6407 74.861 51.4326 75.2019 51.1736C75.5428 50.9146 75.7923 50.6108 75.9332 50.2833C76.0741 49.9559 76.103 49.6125 76.0179 49.2771V2.39956C76.03 2.07005 75.9343 1.74259 75.7371 1.43857C75.5398 1.13454 75.2455 0.860787 74.8732 0.635172C74.501 0.409557 74.0592 0.237156 73.5767 0.129226C73.0942 0.0212958 72.5819 -0.0197376 72.0731 0.00880537C71.9547 0.00505941 71.8361 0.00505941 71.7177 0.00880537ZM25.8489 2.47605C25.0108 2.59204 24.2632 2.89567 23.7386 3.33322C23.2139 3.77076 22.946 4.314 22.9821 4.8668V46.8099C22.897 47.1453 22.9259 47.4886 23.0668 47.8161C23.2077 48.1436 23.4572 48.4473 23.7981 48.7064C24.139 48.9654 24.5631 49.1735 25.041 49.3161C25.5189 49.4588 26.0391 49.5328 26.5656 49.5328C27.0922 49.5328 27.6124 49.4588 28.0903 49.3161C28.5682 49.1735 28.9923 48.9654 29.3331 48.7064C29.674 48.4473 29.9236 48.1436 30.0645 47.8161C30.2054 47.4886 30.2343 47.1453 30.1491 46.8099V4.8668C30.1613 4.53729 30.0656 4.20984 29.8684 3.90581C29.6711 3.60179 29.3768 3.32803 29.0045 3.10241C28.6322 2.8768 28.1904 2.7044 27.708 2.59647C27.2255 2.48854 26.7131 2.4475 26.2044 2.47605C26.086 2.4723 25.9674 2.4723 25.8489 2.47605ZM60.2505 9.87777C59.4123 9.99376 58.6648 10.2974 58.1401 10.7349C57.6154 11.1725 57.3475 11.7157 57.3837 12.2685V39.4082C57.2967 39.744 57.3242 40.0881 57.4641 40.4164C57.604 40.7447 57.8531 41.0493 58.194 41.3092C58.5349 41.5691 58.9594 41.7779 59.438 41.9211C59.9166 42.0643 60.4377 42.1385 60.9653 42.1385C61.4928 42.1385 62.014 42.0643 62.4926 41.9211C62.9712 41.7779 63.3957 41.5691 63.7366 41.3092C64.0774 41.0493 64.3265 40.7447 64.4665 40.4164C64.6064 40.0881 64.6338 39.744 64.5469 39.4082V12.2685C64.5589 11.9395 64.4634 11.6125 64.2666 11.3088C64.0698 11.0052 63.7762 10.7317 63.4048 10.5061C63.0334 10.2806 62.5925 10.1081 62.111 9.9998C61.6294 9.89154 61.1179 9.84996 60.6098 9.87777C60.4888 9.87386 60.3714 9.87386 60.2505 9.87777ZM14.3818 12.345C13.5436 12.461 12.7961 12.7646 12.2714 13.2022C11.7467 13.6397 11.4788 14.183 11.515 14.7358V36.9409C11.428 37.2768 11.4554 37.6208 11.5954 37.9491C11.7353 38.2774 11.9844 38.5821 12.3253 38.842C12.6661 39.1018 13.0906 39.3106 13.5692 39.4538C14.0478 39.5971 14.569 39.6712 15.0965 39.6712C15.6241 39.6712 16.1453 39.5971 16.6239 39.4538C17.1024 39.3106 17.527 39.1018 17.8678 38.842C18.2087 38.5821 18.4578 38.2774 18.5977 37.9491C18.7377 37.6208 18.7651 37.2768 18.6781 36.9409V14.7358C18.6901 14.4067 18.5947 14.0797 18.3979 13.7761C18.2011 13.4724 17.9075 13.1989 17.536 12.9734C17.1646 12.7478 16.7238 12.5753 16.2422 12.467C15.7607 12.3588 15.2492 12.3172 14.7411 12.345C14.6201 12.3411 14.5027 12.3411 14.3818 12.345ZM37.3161 14.8123C36.478 14.9282 35.7304 15.2319 35.2057 15.6694C34.6811 16.107 34.4131 16.6502 34.4493 17.203V34.4737C34.3624 34.8095 34.3898 35.1536 34.5297 35.4819C34.6697 35.8102 34.9187 36.1149 35.2596 36.3747C35.6005 36.6346 36.025 36.8434 36.5036 36.9866C36.9822 37.1298 37.5034 37.204 38.0309 37.204C38.5584 37.204 39.0796 37.1298 39.5582 36.9866C40.0368 36.8434 40.4613 36.6346 40.8022 36.3747C41.1431 36.1149 41.3922 35.8102 41.5321 35.4819C41.672 35.1536 41.6995 34.8095 41.6125 34.4737V17.203C41.6245 16.874 41.529 16.5469 41.3323 16.2433C41.1355 15.9396 40.8418 15.6661 40.4704 15.4406C40.099 15.2151 39.6582 15.0425 39.1766 14.9343C38.695 14.826 38.1835 14.7844 37.6754 14.8123C37.5545 14.8083 37.4371 14.8083 37.3161 14.8123ZM83.1848 14.8123C82.3467 14.9282 81.5991 15.2319 81.0745 15.6694C80.5498 16.107 80.2819 16.6502 80.318 17.203V34.4737C80.2329 34.8091 80.2618 35.1524 80.4027 35.4799C80.5436 35.8074 80.7931 36.1111 81.134 36.3702C81.4749 36.6292 81.899 36.8372 82.3769 36.9799C82.8548 37.1226 83.375 37.1966 83.9015 37.1966C84.4281 37.1966 84.9483 37.1226 85.4262 36.9799C85.9041 36.8372 86.3282 36.6292 86.669 36.3702C87.0099 36.1111 87.2595 35.8074 87.4004 35.4799C87.5413 35.1524 87.5702 34.8091 87.485 34.4737V17.203C87.4972 16.8735 87.4015 16.546 87.2043 16.242C87.007 15.938 86.7127 15.6642 86.3404 15.4386C85.9682 15.213 85.5264 15.0406 85.0439 14.9327C84.5614 14.8247 84.049 14.7837 83.5403 14.8123C83.4219 14.8085 83.3033 14.8085 83.1848 14.8123ZM2.91458 19.7467C2.07643 19.8627 1.32887 20.1664 0.804204 20.6039C0.279537 21.0415 0.0115891 21.5847 0.0477801 22.1375V29.5392C-0.0373541 29.8746 -0.00846988 30.2179 0.13243 30.5454C0.273331 30.8729 0.522876 31.1767 0.863768 31.4357C1.20466 31.6947 1.62874 31.9028 2.10662 32.0455C2.5845 32.1882 3.10474 32.2621 3.63127 32.2621C4.15781 32.2621 4.67805 32.1882 5.15593 32.0455C5.6338 31.9028 6.05789 31.6947 6.39878 31.4357C6.73967 31.1767 6.98922 30.8729 7.13012 30.5454C7.27102 30.2179 7.2999 29.8746 7.21477 29.5392V22.1375C7.2269 21.808 7.13123 21.4805 6.93399 21.1765C6.73676 20.8725 6.44241 20.5987 6.07014 20.3731C5.69788 20.1475 5.25609 19.9751 4.7736 19.8672C4.29111 19.7592 3.77878 19.7182 3.27006 19.7467C3.15036 19.7429 3.03045 19.7429 2.91075 19.7467H2.91458ZM48.7833 19.7467C47.9452 19.8627 47.1976 20.1664 46.6729 20.6039C46.1483 21.0415 45.8803 21.5847 45.9165 22.1375V29.5392C45.8295 29.8751 45.857 30.2191 45.9969 30.5474C46.1368 30.8757 46.3859 31.1804 46.7268 31.4402C47.0677 31.7001 47.4922 31.9089 47.9708 32.0521C48.4494 32.1953 48.9706 32.2695 49.4981 32.2695C50.0256 32.2695 50.5468 32.1953 51.0254 32.0521C51.504 31.9089 51.9285 31.7001 52.2694 31.4402C52.6103 31.1804 52.8593 30.8757 52.9993 30.5474C53.1392 30.2191 53.1666 29.8751 53.0797 29.5392V22.1375C53.0917 21.8084 52.9962 21.4814 52.7994 21.1778C52.6027 20.8741 52.309 20.6006 51.9376 20.3751C51.5662 20.1495 51.1253 19.977 50.6438 19.8688C50.1622 19.7605 49.6507 19.7189 49.1426 19.7467C49.0216 19.7428 48.9043 19.7428 48.7833 19.7467ZM94.652 19.7467C93.8139 19.8627 93.0663 20.1664 92.5417 20.6039C92.017 21.0415 91.749 21.5847 91.7852 22.1375V29.5392C91.7001 29.8746 91.729 30.2179 91.8699 30.5454C92.0108 30.8729 92.2603 31.1767 92.6012 31.4357C92.9421 31.6947 93.3662 31.9028 93.8441 32.0455C94.3219 32.1882 94.8422 32.2621 95.3687 32.2621C95.8953 32.2621 96.4155 32.1882 96.8934 32.0455C97.3713 31.9028 97.7953 31.6947 98.1362 31.4357C98.4771 31.1767 98.7267 30.8729 98.8676 30.5454C99.0085 30.2179 99.0374 29.8746 98.9522 29.5392V22.1375C98.9643 21.808 98.8687 21.4805 98.6714 21.1765C98.4742 20.8725 98.1799 20.5987 97.8076 20.3731C97.4353 20.1475 96.9935 19.9751 96.511 19.8672C96.0286 19.7592 95.5162 19.7182 95.0075 19.7467C94.8891 19.743 94.7704 19.743 94.652 19.7467Z"
fill="white" fill-opacity="0.72" />
</svg>
<div class="btn_play">
<div id="prev_sound">
<svg xmlns="http://www.w3.org/2000/svg" width="10" height="7" viewBox="0 0 10 7" fill="none">
<path d="M10 0V7L5.625 3.5M1.25 0V7H0V0M5.625 0V7L1.25 3.5" fill="#D9D9D9" />
</svg>
</div>
<div id="play_sound" onclick="playPause()">
<i id="ctrlIcon" id="icon" style="color: #D9D9D9;font-size: 10px;" class="fa-solid fa-play"></i>
</div>
<audio id="song">
<source src="Better day.mp3" id="song-audio" type="audio/mpeg">
</audio>
<div id="next_sound">
<svg xmlns="http://www.w3.org/2000/svg" width="8" height="7" viewBox="0 0 8 7" fill="none">
<path d="M0 7V0L3.5 3.5M7 7L7 0H8L8 7M3.5 7L3.5 0L7 3.5" fill="#D9D9D9" />
</svg>
</div>
</div>
<div class="set_sound">
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="12" viewBox="0 0 13 12" fill="none">
<g clip-path="url(#clip0_673_41)">
<path
d="M9.21832 7.61665C9.13939 7.61762 9.06228 7.59469 8.9988 7.55136C8.93532 7.50804 8.88897 7.4467 8.86685 7.37675C8.84473 7.30679 8.84806 7.23207 8.87632 7.16403C8.90458 7.09598 8.95621 7.03836 9.02332 6.99998C9.35191 6.81066 9.62178 6.54601 9.80662 6.2318C9.99147 5.91759 10.085 5.56454 10.0781 5.20705C10.0712 4.84956 9.96407 4.49981 9.7672 4.19189C9.57033 3.88397 9.29041 3.62836 8.95471 3.44998C8.91156 3.42915 8.87342 3.40046 8.84258 3.36567C8.81175 3.33087 8.78886 3.29067 8.77529 3.2475C8.76172 3.20432 8.75775 3.15906 8.76362 3.11443C8.76949 3.0698 8.78509 3.02673 8.80946 2.98781C8.83383 2.94889 8.86648 2.91492 8.90545 2.88795C8.94441 2.86097 8.98888 2.84156 9.03618 2.83086C9.08349 2.82016 9.13265 2.81841 9.18071 2.82571C9.22876 2.833 9.27472 2.8492 9.31582 2.87332C9.75779 3.10988 10.126 3.44786 10.3848 3.85447C10.6436 4.26108 10.7842 4.72253 10.7929 5.19406C10.8017 5.66559 10.6782 6.13119 10.4346 6.54572C10.191 6.96025 9.83546 7.30963 9.40249 7.55998C9.34786 7.59404 9.28417 7.61363 9.21832 7.61665Z"
fill="#EFF1F5" fill-opacity="0.39" />
<path
d="M10.0163 9.59341C9.93545 9.59297 9.85709 9.56749 9.79379 9.52105C9.73048 9.47461 9.68589 9.4099 9.66716 9.33729C9.64843 9.26468 9.65665 9.18837 9.69049 9.12058C9.72433 9.05279 9.78185 8.99744 9.85381 8.96341C10.6113 8.61886 11.2483 8.08418 11.6917 7.4207C12.135 6.75722 12.3668 5.99182 12.3604 5.2123C12.354 4.43279 12.1096 3.67072 11.6554 3.01353C11.2012 2.35634 10.5555 1.83064 9.79242 1.49675C9.7484 1.47848 9.70879 1.45226 9.67593 1.41962C9.64307 1.38698 9.61764 1.34859 9.60113 1.30672C9.58462 1.26486 9.57737 1.22036 9.57981 1.17586C9.58225 1.13136 9.59433 1.08777 9.61533 1.04765C9.63634 1.00754 9.66584 0.971716 9.7021 0.942307C9.73836 0.912897 9.78064 0.890496 9.82643 0.876428C9.87223 0.862359 9.92062 0.856909 9.96874 0.860399C10.0169 0.863889 10.0637 0.876248 10.1066 0.896747C10.993 1.28302 11.7435 1.89209 12.272 2.65411C12.8005 3.41612 13.0857 4.30022 13.0947 5.20499C13.1038 6.10976 12.8364 6.99856 12.3232 7.76945C11.81 8.54034 11.0718 9.1621 10.1933 9.56341C10.138 9.58703 10.0771 9.59735 10.0163 9.59341Z"
fill="#EFF1F5" fill-opacity="0.39" />
<path
d="M7.38387 0.533219L4.03998 3.19989H1.87332C1.77755 3.19989 1.6857 3.23501 1.61797 3.29752C1.55025 3.36003 1.51221 3.44481 1.51221 3.53322V6.83989C1.51221 6.92829 1.55025 7.01308 1.61797 7.07559C1.6857 7.1381 1.77755 7.17322 1.87332 7.17322H3.97137L7.38749 9.91989C7.43916 9.96181 7.50273 9.98924 7.57072 9.99895C7.63871 10.0087 7.70829 10.0002 7.77127 9.97466C7.83424 9.9491 7.888 9.90746 7.92621 9.85464C7.96441 9.80183 7.98548 9.74004 7.98693 9.67655V0.773219C7.9854 0.709379 7.96403 0.647288 7.92538 0.594332C7.88672 0.541376 7.8324 0.499784 7.76887 0.474503C7.70535 0.449221 7.63529 0.441315 7.56704 0.451724C7.49879 0.462133 7.43521 0.49042 7.38387 0.533219Z"
fill="#EFF1F5" />
</g>
<defs>
<clipPath id="clip0_673_41">
<rect width="13" height="12" fill="white" />
</clipPath>
</defs>
</svg>
<input type="range" value="0" id="progress">
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="12" viewBox="0 0 13 12" fill="none">
<g clip-path="url(#clip0_673_46)">
<path
d="M9.21832 7.61665C9.13939 7.61762 9.06228 7.59469 8.9988 7.55136C8.93532 7.50804 8.88897 7.4467 8.86685 7.37675C8.84473 7.30679 8.84806 7.23207 8.87632 7.16403C8.90458 7.09598 8.95621 7.03836 9.02332 6.99998C9.35191 6.81066 9.62178 6.54601 9.80662 6.2318C9.99147 5.91759 10.085 5.56454 10.0781 5.20705C10.0712 4.84956 9.96407 4.49981 9.7672 4.19189C9.57033 3.88397 9.29041 3.62836 8.95471 3.44998C8.91156 3.42915 8.87342 3.40046 8.84258 3.36567C8.81175 3.33087 8.78886 3.29067 8.77529 3.2475C8.76172 3.20432 8.75775 3.15906 8.76362 3.11443C8.76949 3.0698 8.78509 3.02673 8.80946 2.98781C8.83383 2.94889 8.86648 2.91492 8.90545 2.88795C8.94441 2.86097 8.98888 2.84156 9.03618 2.83086C9.08349 2.82016 9.13265 2.81841 9.18071 2.82571C9.22876 2.833 9.27472 2.8492 9.31582 2.87332C9.75779 3.10988 10.126 3.44786 10.3848 3.85447C10.6436 4.26108 10.7842 4.72253 10.7929 5.19406C10.8017 5.66559 10.6782 6.13119 10.4346 6.54572C10.191 6.96025 9.83546 7.30963 9.40249 7.55998C9.34786 7.59404 9.28417 7.61363 9.21832 7.61665Z"
fill="#EFF1F5" />
<path
d="M10.0163 9.59341C9.93545 9.59297 9.85709 9.56749 9.79379 9.52105C9.73048 9.47461 9.68589 9.4099 9.66716 9.33729C9.64843 9.26468 9.65665 9.18837 9.69049 9.12058C9.72433 9.05279 9.78185 8.99744 9.85381 8.96341C10.6113 8.61886 11.2483 8.08418 11.6917 7.4207C12.135 6.75722 12.3668 5.99182 12.3604 5.2123C12.354 4.43279 12.1096 3.67072 11.6554 3.01353C11.2012 2.35634 10.5555 1.83064 9.79242 1.49675C9.7484 1.47848 9.70879 1.45226 9.67593 1.41962C9.64307 1.38698 9.61764 1.34859 9.60113 1.30672C9.58462 1.26486 9.57737 1.22036 9.57981 1.17586C9.58225 1.13136 9.59433 1.08777 9.61533 1.04765C9.63634 1.00754 9.66584 0.971716 9.7021 0.942307C9.73836 0.912897 9.78064 0.890496 9.82643 0.876428C9.87223 0.862359 9.92062 0.856909 9.96874 0.860399C10.0169 0.863889 10.0637 0.876248 10.1066 0.896747C10.993 1.28302 11.7435 1.89209 12.272 2.65411C12.8005 3.41612 13.0857 4.30022 13.0947 5.20499C13.1038 6.10976 12.8364 6.99856 12.3232 7.76945C11.81 8.54034 11.0718 9.1621 10.1933 9.56341C10.138 9.58703 10.0771 9.59735 10.0163 9.59341Z"
fill="#EFF1F5" />
<path
d="M7.38387 0.533219L4.03998 3.19989H1.87332C1.77755 3.19989 1.6857 3.23501 1.61797 3.29752C1.55025 3.36003 1.51221 3.44481 1.51221 3.53322V6.83989C1.51221 6.92829 1.55025 7.01308 1.61797 7.07559C1.6857 7.1381 1.77755 7.17322 1.87332 7.17322H3.97137L7.38749 9.91989C7.43916 9.96181 7.50273 9.98924 7.57072 9.99895C7.63871 10.0087 7.70829 10.0002 7.77127 9.97466C7.83424 9.9491 7.888 9.90746 7.92621 9.85464C7.96441 9.80183 7.98548 9.74004 7.98693 9.67655V0.773219C7.9854 0.709379 7.96403 0.647288 7.92538 0.594332C7.88672 0.541376 7.8324 0.499784 7.76887 0.474503C7.70535 0.449221 7.63529 0.441315 7.56704 0.451724C7.49879 0.462133 7.43521 0.49042 7.38387 0.533219Z"
fill="#EFF1F5" />
</g>
<defs>
<clipPath id="clip0_673_46">
<rect width="13" height="12" fill="white" />
</clipPath>
</defs>
</svg>
</div>
<div class="set_btn">
<div class="right">
<div>
<svg xmlns="http://www.w3.org/2000/svg" width="11" height="10" viewBox="0 0 11 10" fill="none">
<path
d="M7.95536 0C6.94129 0 6.05344 0.462609 5.5 1.24456C4.94656 0.462609 4.05871 0 3.04464 0C2.23743 0.000965195 1.46354 0.34157 0.89276 0.94709C0.321976 1.55261 0.000909826 2.37359 0 3.22993C0 6.87662 5.09683 9.82836 5.31388 9.95026C5.37109 9.98291 5.43504 10 5.5 10C5.56496 10 5.62891 9.98291 5.68612 9.95026C5.90317 9.82836 11 6.87662 11 3.22993C10.9991 2.37359 10.678 1.55261 10.1072 0.94709C9.53646 0.34157 8.76257 0.000965195 7.95536 0ZM5.5 9.10631C4.6033 8.55202 0.785714 6.02694 0.785714 3.22993C0.786494 2.59462 1.02474 1.98557 1.4482 1.53633C1.87166 1.0871 2.44578 0.834357 3.04464 0.83353C3.99978 0.83353 4.8017 1.37324 5.13661 2.24011C5.16621 2.31655 5.21656 2.38193 5.28126 2.42794C5.34597 2.47395 5.4221 2.49852 5.5 2.49852C5.5779 2.49852 5.65403 2.47395 5.71874 2.42794C5.78344 2.38193 5.83379 2.31655 5.86339 2.24011C6.1983 1.37168 7.00022 0.83353 7.95536 0.83353C8.55422 0.834357 9.12834 1.0871 9.5518 1.53633C9.97526 1.98557 10.2135 2.59462 10.2143 3.22993C10.2143 6.02277 6.39571 8.5515 5.5 9.10631Z"
fill="white" />
</svg>
</div>
<div>
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="14" viewBox="0 0 13 14" fill="none">
<path
d="M2.70837 11.6667H10.2917V10.5H2.70837V11.6667ZM10.2917 5.25H8.12504V1.75H4.87504V5.25H2.70837L6.50004 9.33333L10.2917 5.25Z"
fill="white" />
</svg>
</div>
</div>
<div class="left">
<div>
<svg xmlns="http://www.w3.org/2000/svg" width="23" height="23" viewBox="0 0 23 23" fill="none">
<circle cx="11.5" cy="11.5" r="11.5" fill="#303041" />
<path
d="M6.79273 6L16.2073 17M14.1478 14.7698C13.3517 15.2709 12.452 15.625 11.5 15.625C9.42292 15.625 7.5965 13.9393 6.54972 12.7231C6.27317 12.402 6.13489 12.2418 6.04722 11.9262C5.98426 11.7014 5.98426 11.2986 6.04722 11.0738C6.13548 10.7582 6.27376 10.5973 6.55031 10.2763C7.07811 9.663 7.80362 8.9315 8.65916 8.35606M15.9131 13.3109C16.109 13.1094 16.2885 12.9107 16.4497 12.7237L16.4515 12.7217C16.7268 12.4013 16.8651 12.2404 16.9528 11.9269C17.0157 11.7021 17.0157 11.2986 16.9528 11.0738C16.8645 10.7589 16.7268 10.598 16.4503 10.2769C15.4029 9.06075 13.5771 7.375 11.5 7.375C11.3011 7.375 11.1052 7.39013 10.9116 7.419M12.2785 12.5312C12.0506 12.7664 11.7536 12.8893 11.4498 12.8743C11.146 12.8593 10.859 12.7075 10.6489 12.4508C10.4388 12.194 10.3219 11.8521 10.3227 11.4969C10.3235 11.1416 10.442 10.8005 10.6533 10.5451"
stroke="white" stroke-linecap="round" stroke-linejoin="round" />
</svg>
</div>
<div>
<svg xmlns="http://www.w3.org/2000/svg" width="3" height="13" viewBox="0 0 3 13" fill="none">
<path
d="M1.64801 2.34375C2.0059 2.34375 2.29602 2.04294 2.29602 1.67188C2.29602 1.30081 2.0059 1 1.64801 1C1.29012 1 1 1.30081 1 1.67188C1 2.04294 1.29012 2.34375 1.64801 2.34375Z"
stroke="white" stroke-linecap="round" stroke-linejoin="round" />
<path
d="M1.64801 6.64355C2.0059 6.64355 2.29602 6.34275 2.29602 5.97168C2.29602 5.60061 2.0059 5.2998 1.64801 5.2998C1.29012 5.2998 1 5.60061 1 5.97168C1 6.34275 1.29012 6.64355 1.64801 6.64355Z"
stroke="white" stroke-linecap="round" stroke-linejoin="round" />
<path
d="M1.64801 11.75C2.0059 11.75 2.29602 11.4492 2.29602 11.0781C2.29602 10.7071 2.0059 10.4062 1.64801 10.4062C1.29012 10.4062 1 10.7071 1 11.0781C1 11.4492 1.29012 11.75 1.64801 11.75Z"
stroke="white" stroke-linecap="round" stroke-linejoin="round" />
</svg>
</div>
</div>
</div>
</div>
<script src="./static/Css/Js/draggable.js"></script>
<script src="./static/Css/Js/draggable2.js"></script>
<div class="code-box" id="draggableDiv" contenteditable="true" style="display: none;">
<p>// Code in Here</p>
</div>
<!-----NEW---->
<div class="calendar" id="calend" style="display: none;">
<div class="avt-box">
<img src="./static/Css/Img/AVT.jfif" alt="" id="avt">
<div class="hello">
<p id="name">
MorazOrial
</p>
<p style="padding-top: 3p;">
Chào Buổi Sáng!!!
</p>
</div>
</div>
<div class="calen">
<div class="month">
<svg xmlns="http://www.w3.org/2000/svg" width="6" height="9" viewBox="0 0 6 9" fill="none">
<path
d="M0.502586 3.30891C-0.167529 3.82819 -0.167529 5.17186 0.502586 5.69115L4.54877 8.82667C5.19939 9.33111 6 8.67413 6 7.6351L6 1.36496C6 0.32548 5.19976 -0.331054 4.54877 0.173385L0.502586 3.30891Z"
fill="#F8F8F8" fill-opacity="0.85" />
</svg>
<p id="name_month">
Tháng 10
</p>
<svg xmlns="http://www.w3.org/2000/svg" width="6" height="9" viewBox="0 0 6 9" fill="none">
<path
d="M5.49741 5.69109C6.16753 5.17181 6.16753 3.82814 5.49741 3.30885L1.45123 0.173327C0.800613 -0.331111 0 0.325873 0 1.3649V7.63504C0 8.67452 0.800238 9.33105 1.45123 8.82662L5.49741 5.69109Z"
fill="#F8F8F8" fill-opacity="0.85" />
</svg>
</div>
<div class="date">
<p>S</p>
<p>M</p>
<p>T</p>
<p>W</p>
<p>T</p>
<p>F</p>
<p>S</p>
</div>
<div class="day">
<div class="week">
<p style="color: rgba(255, 255, 255, 0.46);">25</p>
<p style="color: rgba(255, 255, 255, 0.46);">26</p>
<p style="color: rgba(255, 255, 255, 0.46);">27</p>
<p style="color: rgba(255, 255, 255, 0.46);">28</p>
<p style="color: rgba(255, 255, 255, 0.46);">29</p>
<p style="color: rgba(255, 255, 255, 0.46);">30</p>
<p>01</p>
</div>
<div class="week">
<p>02</p>
<p>03</p>
<p>04</p>
<p>05</p>
<p>06</p>
<p>07</p>
<p>08</p>
</div>
<div class="week">
<p>09</p>
<p>10</p>
<p>11</p>
<p>12</p>
<p>13</p>
<p>14</p>
<p style="color: #CAA6F9;font-size: 13px;">15</p>
</div>
<div class="week">
<p>16</p>
<p>17</p>
<p>18</p>
<p>19</p>
<p>20</p>
<p>21</p>
<p>22</p>
</div>
<div class="week">
<p>23</p>
<p>24</p>
<p>25</p>
<p>26</p>
<p>27</p>
<p>28</p>
<p>29</p>
</div>
<div class="week">
<p>30</p>
<p>31</p>
<p style="color: rgba(255, 255, 255, 0.46);">01</p>
<p style="color: rgba(255, 255, 255, 0.46);">02</p>
<p style="color: rgba(255, 255, 255, 0.46);">03</p>
<p style="color: rgba(255, 255, 255, 0.46);">04</p>
<p style="color: rgba(255, 255, 255, 0.46);">05</p>
</div>
</div>
</div>
<div class="choose-time">
<div class="tile">
<p style="color: rgba(255, 255, 255, 0.67);
font-family: Fira Code;
font-size: 10px;
font-style: normal;
font-weight: 500;
line-height: normal;">Thời Gian</p>
<p id="new-time">
New Time
</p>
</div>
<div class="choose">
<div class="time-item" onclick="time_item1()">
<p id="time_item1">01:00</p>
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="23" viewBox="0 0 20 23" fill="none">
<path
d="M2.30556 12.0476H5.55556C5.75926 12.0476 5.9537 12.098 6.13889 12.1988C6.32407 12.2995 6.46296 12.4499 6.55556 12.65L7.77778 15.0595L11.2222 8.26905C11.4259 7.84921 11.7593 7.63928 12.2222 7.63928C12.6852 7.63928 13.0185 7.84921 13.2222 8.26905L15.1389 12.0476H17.6944C17.4167 10.1857 16.5556 8.625 15.1111 7.36548C13.6667 6.10595 11.963 5.47619 10 5.47619C8.03704 5.47619 6.33333 6.10595 4.88889 7.36548C3.44445 8.625 2.58333 10.1857 2.30556 12.0476ZM10 20.8095C11.963 20.8095 13.6667 20.1798 15.1111 18.9202C16.5556 17.6607 17.4167 16.1 17.6944 14.2381H14.4444C14.2407 14.2381 14.0463 14.1877 13.8611 14.087C13.6759 13.9862 13.537 13.8358 13.4444 13.6357L12.2222 11.2262L8.77778 18.0167C8.57407 18.4365 8.24074 18.6464 7.77778 18.6464C7.31482 18.6464 6.98148 18.4365 6.77778 18.0167L4.86111 14.2381H2.30556C2.58333 16.1 3.44445 17.6607 4.88889 18.9202C6.33333 20.1798 8.03704 20.8095 10 20.8095ZM10 23C8.62963 23 7.33778 22.7397 6.12445 22.2191C4.91111 21.6985 3.85111 20.9913 2.94445 20.0976C2.03704 19.2032 1.31926 18.1579 0.791112 16.962C0.262964 15.766 -0.000739184 14.4929 1.55618e-06 13.1429H2.22222C2.22222 15.2603 2.98148 17.0675 4.5 18.5643C6.01852 20.0611 7.85185 20.8095 10 20.8095C12.1481 20.8095 13.9815 20.0611 15.5 18.5643C17.0185 17.0675 17.7778 15.2603 17.7778 13.1429H20C20 14.4936 19.7359 15.767 19.2078 16.963C18.6796 18.159 17.9622 19.2039 17.0556 20.0976C16.1481 20.9921 15.0878 21.6996 13.8744 22.2202C12.6611 22.7408 11.3696 23.0007 10 23ZM1.55618e-06 13.1429C1.55618e-06 11.7921 0.264076 10.5187 0.792224 9.32267C1.32037 8.12667 2.03778 7.08181 2.94445 6.18809C3.85185 5.29365 4.91222 4.58613 6.12556 4.06552C7.33889 3.54492 8.63037 3.28498 10 3.28571C11.1481 3.28571 12.25 3.46825 13.3056 3.83333C14.3611 4.19841 15.3519 4.72778 16.2778 5.42143L17.8333 3.88809L19.3889 5.42143L17.8333 6.95476C18.537 7.86746 19.0741 8.84405 19.4444 9.88452C19.8148 10.925 20 12.0111 20 13.1429H17.7778C17.7778 11.0254 17.0185 9.21825 15.5 7.72143C13.9815 6.2246 12.1481 5.47619 10 5.47619C7.85185 5.47619 6.01852 6.2246 4.5 7.72143C2.98148 9.21825 2.22222 11.0254 2.22222 13.1429H1.55618e-06ZM6.66667 2.19048V0H13.3333V2.19048H6.66667ZM10 20.8095C7.85185 20.8095 6.01852 20.0611 4.5 18.5643C2.98148 17.0675 2.22222 15.2603 2.22222 13.1429C2.22222 11.0254 2.98148 9.21825 4.5 7.72143C6.01852 6.2246 7.85185 5.47619 10 5.47619C12.1481 5.47619 13.9815 6.2246 15.5 7.72143C17.0185 9.21825 17.7778 11.0254 17.7778 13.1429C17.7778 15.2603 17.0185 17.0675 15.5 18.5643C13.9815 20.0611 12.1481 20.8095 10 20.8095Z"
fill="#F8F8F8" fill-opacity="0.69" />
</svg>
<p id="status">
Off
</p>
</div>
<div class="time-item" onclick="time_item2()">
<p id="time_item2">60:00</p>
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="23" viewBox="0 0 20 23" fill="none">
<path
d="M2.30556 12.0476H5.55556C5.75926 12.0476 5.9537 12.098 6.13889 12.1988C6.32407 12.2995 6.46296 12.4499 6.55556 12.65L7.77778 15.0595L11.2222 8.26905C11.4259 7.84921 11.7593 7.63928 12.2222 7.63928C12.6852 7.63928 13.0185 7.84921 13.2222 8.26905L15.1389 12.0476H17.6944C17.4167 10.1857 16.5556 8.625 15.1111 7.36548C13.6667 6.10595 11.963 5.47619 10 5.47619C8.03704 5.47619 6.33333 6.10595 4.88889 7.36548C3.44445 8.625 2.58333 10.1857 2.30556 12.0476ZM10 20.8095C11.963 20.8095 13.6667 20.1798 15.1111 18.9202C16.5556 17.6607 17.4167 16.1 17.6944 14.2381H14.4444C14.2407 14.2381 14.0463 14.1877 13.8611 14.087C13.6759 13.9862 13.537 13.8358 13.4444 13.6357L12.2222 11.2262L8.77778 18.0167C8.57407 18.4365 8.24074 18.6464 7.77778 18.6464C7.31482 18.6464 6.98148 18.4365 6.77778 18.0167L4.86111 14.2381H2.30556C2.58333 16.1 3.44445 17.6607 4.88889 18.9202C6.33333 20.1798 8.03704 20.8095 10 20.8095ZM10 23C8.62963 23 7.33778 22.7397 6.12445 22.2191C4.91111 21.6985 3.85111 20.9913 2.94445 20.0976C2.03704 19.2032 1.31926 18.1579 0.791112 16.962C0.262964 15.766 -0.000739184 14.4929 1.55618e-06 13.1429H2.22222C2.22222 15.2603 2.98148 17.0675 4.5 18.5643C6.01852 20.0611 7.85185 20.8095 10 20.8095C12.1481 20.8095 13.9815 20.0611 15.5 18.5643C17.0185 17.0675 17.7778 15.2603 17.7778 13.1429H20C20 14.4936 19.7359 15.767 19.2078 16.963C18.6796 18.159 17.9622 19.2039 17.0556 20.0976C16.1481 20.9921 15.0878 21.6996 13.8744 22.2202C12.6611 22.7408 11.3696 23.0007 10 23ZM1.55618e-06 13.1429C1.55618e-06 11.7921 0.264076 10.5187 0.792224 9.32267C1.32037 8.12667 2.03778 7.08181 2.94445 6.18809C3.85185 5.29365 4.91222 4.58613 6.12556 4.06552C7.33889 3.54492 8.63037 3.28498 10 3.28571C11.1481 3.28571 12.25 3.46825 13.3056 3.83333C14.3611 4.19841 15.3519 4.72778 16.2778 5.42143L17.8333 3.88809L19.3889 5.42143L17.8333 6.95476C18.537 7.86746 19.0741 8.84405 19.4444 9.88452C19.8148 10.925 20 12.0111 20 13.1429H17.7778C17.7778 11.0254 17.0185 9.21825 15.5 7.72143C13.9815 6.2246 12.1481 5.47619 10 5.47619C7.85185 5.47619 6.01852 6.2246 4.5 7.72143C2.98148 9.21825 2.22222 11.0254 2.22222 13.1429H1.55618e-06ZM6.66667 2.19048V0H13.3333V2.19048H6.66667ZM10 20.8095C7.85185 20.8095 6.01852 20.0611 4.5 18.5643C2.98148 17.0675 2.22222 15.2603 2.22222 13.1429C2.22222 11.0254 2.98148 9.21825 4.5 7.72143C6.01852 6.2246 7.85185 5.47619 10 5.47619C12.1481 5.47619 13.9815 6.2246 15.5 7.72143C17.0185 9.21825 17.7778 11.0254 17.7778 13.1429C17.7778 15.2603 17.0185 17.0675 15.5 18.5643C13.9815 20.0611 12.1481 20.8095 10 20.8095Z"
fill="#F8F8F8" fill-opacity="0.69" />
</svg>
<p id="status">
Off
</p>
</div>
<div class="time-item" onclick="time_item3()">
<p id="time_item3">45:00</p>
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="23" viewBox="0 0 20 23" fill="none">
<path
d="M2.30556 12.0476H5.55556C5.75926 12.0476 5.9537 12.098 6.13889 12.1988C6.32407 12.2995 6.46296 12.4499 6.55556 12.65L7.77778 15.0595L11.2222 8.26905C11.4259 7.84921 11.7593 7.63928 12.2222 7.63928C12.6852 7.63928 13.0185 7.84921 13.2222 8.26905L15.1389 12.0476H17.6944C17.4167 10.1857 16.5556 8.625 15.1111 7.36548C13.6667 6.10595 11.963 5.47619 10 5.47619C8.03704 5.47619 6.33333 6.10595 4.88889 7.36548C3.44445 8.625 2.58333 10.1857 2.30556 12.0476ZM10 20.8095C11.963 20.8095 13.6667 20.1798 15.1111 18.9202C16.5556 17.6607 17.4167 16.1 17.6944 14.2381H14.4444C14.2407 14.2381 14.0463 14.1877 13.8611 14.087C13.6759 13.9862 13.537 13.8358 13.4444 13.6357L12.2222 11.2262L8.77778 18.0167C8.57407 18.4365 8.24074 18.6464 7.77778 18.6464C7.31482 18.6464 6.98148 18.4365 6.77778 18.0167L4.86111 14.2381H2.30556C2.58333 16.1 3.44445 17.6607 4.88889 18.9202C6.33333 20.1798 8.03704 20.8095 10 20.8095ZM10 23C8.62963 23 7.33778 22.7397 6.12445 22.2191C4.91111 21.6985 3.85111 20.9913 2.94445 20.0976C2.03704 19.2032 1.31926 18.1579 0.791112 16.962C0.262964 15.766 -0.000739184 14.4929 1.55618e-06 13.1429H2.22222C2.22222 15.2603 2.98148 17.0675 4.5 18.5643C6.01852 20.0611 7.85185 20.8095 10 20.8095C12.1481 20.8095 13.9815 20.0611 15.5 18.5643C17.0185 17.0675 17.7778 15.2603 17.7778 13.1429H20C20 14.4936 19.7359 15.767 19.2078 16.963C18.6796 18.159 17.9622 19.2039 17.0556 20.0976C16.1481 20.9921 15.0878 21.6996 13.8744 22.2202C12.6611 22.7408 11.3696 23.0007 10 23ZM1.55618e-06 13.1429C1.55618e-06 11.7921 0.264076 10.5187 0.792224 9.32267C1.32037 8.12667 2.03778 7.08181 2.94445 6.18809C3.85185 5.29365 4.91222 4.58613 6.12556 4.06552C7.33889 3.54492 8.63037 3.28498 10 3.28571C11.1481 3.28571 12.25 3.46825 13.3056 3.83333C14.3611 4.19841 15.3519 4.72778 16.2778 5.42143L17.8333 3.88809L19.3889 5.42143L17.8333 6.95476C18.537 7.86746 19.0741 8.84405 19.4444 9.88452C19.8148 10.925 20 12.0111 20 13.1429H17.7778C17.7778 11.0254 17.0185 9.21825 15.5 7.72143C13.9815 6.2246 12.1481 5.47619 10 5.47619C7.85185 5.47619 6.01852 6.2246 4.5 7.72143C2.98148 9.21825 2.22222 11.0254 2.22222 13.1429H1.55618e-06ZM6.66667 2.19048V0H13.3333V2.19048H6.66667ZM10 20.8095C7.85185 20.8095 6.01852 20.0611 4.5 18.5643C2.98148 17.0675 2.22222 15.2603 2.22222 13.1429C2.22222 11.0254 2.98148 9.21825 4.5 7.72143C6.01852 6.2246 7.85185 5.47619 10 5.47619C12.1481 5.47619 13.9815 6.2246 15.5 7.72143C17.0185 9.21825 17.7778 11.0254 17.7778 13.1429C17.7778 15.2603 17.0185 17.0675 15.5 18.5643C13.9815 20.0611 12.1481 20.8095 10 20.8095Z"
fill="#CBA6F7" fill-opacity="0.69" />
</svg>
<p id="status" style="color: rgba(203, 166, 247, 0.90);">
On
</p>
</div>
<div class="time-item" onclick="time_item4()">
<p id="time_item4">55:00</p>
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="23" viewBox="0 0 20 23" fill="none">
<path
d="M2.30556 12.0476H5.55556C5.75926 12.0476 5.9537 12.098 6.13889 12.1988C6.32407 12.2995 6.46296 12.4499 6.55556 12.65L7.77778 15.0595L11.2222 8.26905C11.4259 7.84921 11.7593 7.63928 12.2222 7.63928C12.6852 7.63928 13.0185 7.84921 13.2222 8.26905L15.1389 12.0476H17.6944C17.4167 10.1857 16.5556 8.625 15.1111 7.36548C13.6667 6.10595 11.963 5.47619 10 5.47619C8.03704 5.47619 6.33333 6.10595 4.88889 7.36548C3.44445 8.625 2.58333 10.1857 2.30556 12.0476ZM10 20.8095C11.963 20.8095 13.6667 20.1798 15.1111 18.9202C16.5556 17.6607 17.4167 16.1 17.6944 14.2381H14.4444C14.2407 14.2381 14.0463 14.1877 13.8611 14.087C13.6759 13.9862 13.537 13.8358 13.4444 13.6357L12.2222 11.2262L8.77778 18.0167C8.57407 18.4365 8.24074 18.6464 7.77778 18.6464C7.31482 18.6464 6.98148 18.4365 6.77778 18.0167L4.86111 14.2381H2.30556C2.58333 16.1 3.44445 17.6607 4.88889 18.9202C6.33333 20.1798 8.03704 20.8095 10 20.8095ZM10 23C8.62963 23 7.33778 22.7397 6.12445 22.2191C4.91111 21.6985 3.85111 20.9913 2.94445 20.0976C2.03704 19.2032 1.31926 18.1579 0.791112 16.962C0.262964 15.766 -0.000739184 14.4929 1.55618e-06 13.1429H2.22222C2.22222 15.2603 2.98148 17.0675 4.5 18.5643C6.01852 20.0611 7.85185 20.8095 10 20.8095C12.1481 20.8095 13.9815 20.0611 15.5 18.5643C17.0185 17.0675 17.7778 15.2603 17.7778 13.1429H20C20 14.4936 19.7359 15.767 19.2078 16.963C18.6796 18.159 17.9622 19.2039 17.0556 20.0976C16.1481 20.9921 15.0878 21.6996 13.8744 22.2202C12.6611 22.7408 11.3696 23.0007 10 23ZM1.55618e-06 13.1429C1.55618e-06 11.7921 0.264076 10.5187 0.792224 9.32267C1.32037 8.12667 2.03778 7.08181 2.94445 6.18809C3.85185 5.29365 4.91222 4.58613 6.12556 4.06552C7.33889 3.54492 8.63037 3.28498 10 3.28571C11.1481 3.28571 12.25 3.46825 13.3056 3.83333C14.3611 4.19841 15.3519 4.72778 16.2778 5.42143L17.8333 3.88809L19.3889 5.42143L17.8333 6.95476C18.537 7.86746 19.0741 8.84405 19.4444 9.88452C19.8148 10.925 20 12.0111 20 13.1429H17.7778C17.7778 11.0254 17.0185 9.21825 15.5 7.72143C13.9815 6.2246 12.1481 5.47619 10 5.47619C7.85185 5.47619 6.01852 6.2246 4.5 7.72143C2.98148 9.21825 2.22222 11.0254 2.22222 13.1429H1.55618e-06ZM6.66667 2.19048V0H13.3333V2.19048H6.66667ZM10 20.8095C7.85185 20.8095 6.01852 20.0611 4.5 18.5643C2.98148 17.0675 2.22222 15.2603 2.22222 13.1429C2.22222 11.0254 2.98148 9.21825 4.5 7.72143C6.01852 6.2246 7.85185 5.47619 10 5.47619C12.1481 5.47619 13.9815 6.2246 15.5 7.72143C17.0185 9.21825 17.7778 11.0254 17.7778 13.1429C17.7778 15.2603 17.0185 17.0675 15.5 18.5643C13.9815 20.0611 12.1481 20.8095 10 20.8095Z"
fill="#F8F8F8" fill-opacity="0.69" />
</svg>
<p id="status">
Off
</p>
</div>
</div>
</div>
</div>
<!-----NEW---->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$(function () {
// Make the div draggable and resizable using jQuery UI
$("#draggableDiv").draggable();
$("#draggableDiv").resizable();
});
</script>
</div>
<div id="pop_u" style="display: none;opacity: 0;">
<div class="content_box" style="opacity: 0;">
<p class="pop-h">
Cảnh Báo
</p>
<div class="pop-m">
Log Out tương đương việc bạn sẽ nhận được số điểm hiện tại, bạn có muốn tiếp tục dừng lại không?
</div>
<div class="btn_box">
<a onclick="cance()">
<div class="btn_cancel">
Cancel
</div>
</a>
<a href="index.html">
<div class="btn_log">
Log Out
</div>
</a>
</div>
</div>
</div>
<script>
function pop() {
document.querySelector('.content_box').classList.remove('animation-status7'); // Remove any previous animation class
document.getElementById('pop_u').classList.remove('animation-status9');
document.getElementById('pop_u').classList.add('animation-status8');
document.getElementById('pop_u').style.display = "flex";
document.getElementById('pop_u').style.opacity = "1";
document.querySelector('.content_box').classList.add('animation-status6');
}
function cance() {
document.querySelector('.content_box').classList.add('animation-status7');
document.getElementById('pop_u').classList.add('animation-status9');
setTimeout(function () {
document.getElementById('pop_u').style.opacity = "0";
document.getElementById('pop_u').style.display = "none";
}, 300);
// 300 milliseconds = 0.3 seconds
// document.getElementById('pop_u').style.opacity = "0";
}
</script>
<script>
let progress = document.getElementById("progress");
let progress1 = document.getElementById("progress1");
let song = document.getElementById("song");
let ctrlIcon = document.getElementById("ctrlIcon");
song.onloadeddata = function () {
progress.max = song.duration;
progress.value = song.currentTime;
}
function playPause() {
if (ctrlIcon.classList.contains("fa-pause")) {
song.pause();
ctrlIcon.classList.remove("fa-pause");
ctrlIcon.classList.add("fa-play");
}
else {
song.play();
ctrlIcon.classList.add("fa-pause");
ctrlIcon.classList.remove("fa-play");
}
}
if (song.play()) {
setInterval(() => {
progress.value = song.currentTime
}, 500);
}
progress.onchange = function () {
song.play();
song.currentTime = progress.value;
ctrlIcon.classList.add("fa-pause");
ctrlIcon.classList.remove("fa-play");
}
</script>
<script>
// Retrieve the audio element and volume slider
var audio = document.getElementById("song");
var volumeSlider = document.getElementById("progress1");
// Attach an event listener to the volume slider
volumeSlider.addEventListener("input", function () {
// Update the audio volume based on the slider value
audio.volume = volumeSlider.value;
});
audio.play();
</script>
<audio id="song-time-out">
<source src="./static/Css/Audio/timeout.mp3" type="audio/mpeg">
</audio>
<script>
function changeFavicon(url) {
var link = document.querySelector("link[rel*='icon']");
if (link) {
link.href = url;
} else {
link = document.createElement('link');
link.rel = 'icon';
link.href = url;
document.head.appendChild(link);
}
}
</script>
<script>
var a = 45
var kq = 900
var duration = 2700
var number1 = document.getElementById('time_item1');
var number2 = document.getElementById('time_item2');
var number3 = document.getElementById('time_item3');
var number4 = document.getElementById('time_item4');
function time_item1() {
a = parseFloat(number1.textContent);
kq = kq + a
duration = a * 60; // 5 minutes in seconds
}
function time_item2() {
a = parseFloat(number2.textContent);
kq = kq + a
duration = a * 60; // 5 minutes in seconds
}
function time_item3() {
a = parseFloat(number3.textContent);
kq = kq + a
duration = a * 60; // 5 minutes in seconds
}
function time_item4() {
a = parseFloat(number4.textContent);
kq = kq + a
duration = a * 60; // 5 minutes in seconds
}
setInterval(checkFocus, 200);
var b = 0;
function checkFocus() {
if (document.hasFocus()) {
} else {
b++;
}
}
var timerElement = document.getElementById("timer");
function displayTimeLeft() {
var minutes = Math.floor(duration / 60);
var seconds = duration % 60;
timerElement.textContent = minutes + ":" + seconds;
if (duration > 0) {
duration--;
setTimeout(displayTimeLeft, 1000); // Update every second
document.getElementById("diem-so").style.display = "none";
} else {
// When the timer reaches zero, play the audio
var audio = document.getElementById("song-time-out");
audio.play();
document.getElementById("diem-so").style.display = "flex";
document.getElementById("num-tile").textContent = kq - b;
document.getElementById("het-cuu").style.fill = "#CAA6F9";
changeFavicon('tb-logo.png');
}
}
displayTimeLeft();
</script>
<script>
function bt() {
if (document.getElementById("calend").style.display == "none") {
document.getElementById("calend").classList.add('animation-status');
document.getElementById("calend").style.display = "flex";
document.getElementById("calend").style.opacity = "1";