-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
1063 lines (955 loc) · 60.5 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
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 name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- SEO Meta Tags -->
<meta name="description" content="Ứng dụng học tiếng Anh qua trò chơi tương tác Raise your English">
<meta name="author" content="XTeam">
<!-- OG Meta Tags to improve the way the post looks when you share the page on LinkedIn, Facebook, Google+ -->
<meta property="og:site_name" content="Raise your English" /> <!-- website name -->
<meta property="og:site" content="" /> <!-- website link -->
<meta property="og:title" content=""/> <!-- title shown in the actual shared post -->
<meta property="og:description" content="" /> <!-- description shown in the actual shared post -->
<meta property="og:image" content="" /> <!-- image link, make sure it's jpg -->
<meta property="og:url" content="" /> <!-- where do you want your post to link to -->
<meta property="og:type" content="article" />
<!-- Website Title -->
<title>Raise your English</title>
<!-- Styles -->
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,600,700" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700,700i" rel="stylesheet">
<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/fontawesome-all.css" rel="stylesheet">
<link href="css/swiper.css" rel="stylesheet">
<link href="css/magnific-popup.css" rel="stylesheet">
<link href="css/styles.css" rel="stylesheet">
<!-- Favicon -->
<link rel="icon" href="images/favicon.png">
</head>
<body data-spy="scroll" data-target=".fixed-top">
<!-- Preloader -->
<div class="spinner-wrapper">
<div class="spinner">
<div class="bounce1"></div>
<div class="bounce2"></div>
<div class="bounce3"></div>
</div>
</div>
<!-- end of preloader -->
<!-- Navbar -->
<nav class="navbar navbar-expand-md navbar-dark navbar-custom fixed-top">
<!-- Text Logo - Use this if you don't have a graphic logo
<a class="navbar-brand logo-text page-scroll" href="index.html">LEbX</a> -->
<!-- Image Logo -->
<a class="navbar-brand logo-image" href="index.html"><img src="images/logo.png" alt="alternative"></a>
<!-- Mobile Menu Toggle Button -->
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-awesome fas fa-bars"></span>
<span class="navbar-toggler-awesome fas fa-times"></span>
</button>
<!-- end of mobile menu toggle button -->
<div class="collapse navbar-collapse" id="navbarsExampleDefault">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link page-scroll" href="#header">TRANG CHỦ<span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link page-scroll" href="#preview">GIỚI THIỆU</a>
</li>
<li class="nav-item">
<a class="nav-link page-scroll" href="#features">TÍNH NĂNG</a>
</li>
<!-- Dropdown Menu -->
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle page-scroll" href="#details" id="navbarDropdown" role="button" aria-haspopup="true" aria-expanded="false">CHI TIẾT SẢN PHẨM</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="tro-choi.html"><span class="item-text">TRÒ CHƠI</span></a>
<div class="dropdown-items-divide-hr"></div>
<a class="dropdown-item" href="chu-diem-tieng-anh.html"><span class="item-text">CHỦ ĐIỂM TIẾNG ANH</span></a>
<div class="dropdown-items-divide-hr"></div>
<a class="dropdown-item" href="tinh-ca-nhan-hoa.html"><span class="item-text">TÍNH CÁ NHÂN HÓA</span></a>
</div>
</li>
<!-- end of dropdown menu -->
<li class="nav-item">
<a class="nav-link page-scroll" href="#contact">LIÊN HỆ</a>
</li>
</ul>
<span class="nav-item social-icons">
<span class="fa-stack">
<a href="https://www.facebook.com/Raise-Your-English-104075271602316/" target="_blank">
<i class="fas fa-circle fa-stack-2x"></i>
<i class="fab fa-facebook-f fa-stack-1x"></i>
</a>
</span>
<span class="fa-stack">
<a href="https://www.youtube.com/channel/UCDd2OL5zmUpIfPQpwCv41jQ" target="_blank">
<i class="fas fa-circle fa-stack-2x"></i>
<i class="fab fa-youtube fa-stack-1x"></i>
</a>
</span>
</span>
</div>
</nav> <!-- end of navbar -->
<!-- end of navbar -->
<!-- Header -->
<header id="header" class="header">
<div class="header-content">
<div class="container">
<div class="row">
<div class="col-lg-6">
<div class="text-container">
<h1>ỨNG DỤNG <br>CHO NGƯỜI <span id="js-rotating"> MUỐN HỌC TIẾNG ANH, CHÁN HỌC TIẾNG ANH, MẤT ĐỘNG LỰC HỌC TIẾNG ANH</span></h1>
<p class="p-large">Raise your English hứa hẹn sẽ là một trong những ứng dụng tự học tiếng Anh hay và hấp dẫn nhất thị trường. Hãy ủng hộ cho XTeam để chúng tôi có cơ hội được hiện thực hóa ước mơ đem lại động lực học Tiếng Anh đến với các bạn!</p>
<a class="btn-solid-lg page-scroll" href="#preview"><i class="fas fa-info"></i> GIỚI THIỆU</a>
<a class="btn-solid-lg page-scroll" href="https://xd.adobe.com/view/f9989f2f-a21f-4c59-87bb-95961f4baa84-accb/?fullscreen&hints=off" target="_blank"><i class="fas fa-box"></i> DEMO</a>
</div>
</div> <!-- end of col -->
<div class="col-lg-6">
<div class="image-container">
<img class="img-fluid" src="images/app_images/1.png" alt="alternative">
</div> <!-- end of image-container -->
</div> <!-- end of col -->
</div> <!-- end of row -->
</div> <!-- end of container -->
</div> <!-- end of header-content -->
</header> <!-- end of header -->
<!-- end of header -->
<!-- Người cảm thấy khó khăn trong việc học tiếng Anh / phần cũ là Testimonials
<div id="testimonials" class="slider-1">
<div class="container">
<div class="row">
<div class="col-lg-12">
<h2 style="font-size: 26px"><center>Cảm nhận của những người bất lực trong việc học tiếng Anh</center></h2>
<br>-->
<!-- Card Slider
<div class="slider-container">
<div class="swiper-container card-slider">
<div class="swiper-wrapper">-->
<!-- Slide
<div class="swiper-slide">
<div class="card">
<img class="card-image" src="images/testimonial-1.jpg" alt="alternative">
<div class="card-body">
<p class="testimonial-text">Quan điểm người học</p>
<p class="testimonial-author">Nguyễn Văn A - K64 - Đại học Bách Khoa Hà Nội</p>
</div>
</div>
</div> --><!-- end of swiper-slide -->
<!-- end of slide -->
<!-- Slide
<div class="swiper-slide">
<div class="card">
<img class="card-image" src="images/testimonial-2.jpg" alt="alternative">
<div class="card-body">
<p class="testimonial-text">Quan điểm người học</p>
<p class="testimonial-author">Nguyễn Văn B - K64 - Đại học Bách Khoa Hà Nội</p>
</div>
</div>
</div> --><!-- end of swiper-slide -->
<!-- end of slide -->
<!-- Slide
<div class="swiper-slide">
<div class="card">
<img class="card-image" src="images/testimonial-3.jpg" alt="alternative">
<div class="card-body">
<p class="testimonial-text">Quan điểm người học</p>
<p class="testimonial-author">Nguyễn Văn C - K64 - Đại học Bách Khoa Hà Nội</p>
</div>
</div>
</div> --><!-- end of swiper-slide -->
<!-- end of slide -->
<!-- Slide
<div class="swiper-slide">
<div class="card">
<img class="card-image" src="images/testimonial-4.jpg" alt="alternative">
<div class="card-body">
<p class="testimonial-text">Quan điểm người học</p>
<p class="testimonial-author">Nguyễn Văn D - K64 - Đại học Bách Khoa Hà Nội</p>
</div>
</div>
</div> --><!-- end of swiper-slide -->
<!-- end of slide -->
<!-- Slide
<div class="swiper-slide">
<div class="card">
<img class="card-image" src="images/testimonial-5.jpg" alt="alternative">
<div class="card-body">
<p class="testimonial-text">Quan điểm người học</p>
<p class="testimonial-author">Nguyễn Văn D - K64 - Đại học Bách Khoa Hà Nội</p>
</div>
</div>
</div> --><!-- end of swiper-slide -->
<!-- end of slide -->
<!-- Slide
<div class="swiper-slide">
<div class="card">
<img class="card-image" src="images/testimonial-6.jpg" alt="alternative">
<div class="card-body">
<p class="testimonial-text">Quan điểm người học</p>
<p class="testimonial-author">Nguyễn Văn D - K64 - Đại học Bách Khoa Hà Nội</p>
</div>
</div>
</div> --><!-- end of swiper-slide -->
<!-- end of slide -->
<!-- </div> end of swiper-wrapper -->
<!-- Add Arrows
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
end of add arrows -->
<!-- </div> end of swiper-container
</div> --><!-- end of slider-container -->
<!-- end of card slider -->
<!--</div> end of col
</div> --><!-- end of row
</div> --><!-- end of container
</div> --><!-- end of slider-1 -->
<!-- end of testimonials -->
<!--market research -->
<div class="counter">
<div class="container">
<div class="row">
<div class="col-lg-12">
<h2><center>KHẢO SÁT</center></h2>
<p><em>Đối với 60 người độ tuổi từ 17-21</em></p>
<br></br>
<!-- Counter -->
<div id="counter">
<div class="cell">
<div class="counter-value number-count" data-count="56">1</div>
<p class="counter-info">Đã từng học tiếng Anh qua ứng dụng</p>
</div>
<div class="cell">
<div class="counter-value number-count" data-count="46">1</div>
<p class="counter-info">Người không đủ kiên trì để tiếp tục</p>
</div>
<div class="cell">
<div class="counter-value number-count" data-count="58">1</div>
<p class="counter-info">Người thấy hào hứng về ý tưởng</p>
</div>
</div>
<!-- end of counter -->
</div> <!-- end of col -->
</div> <!-- end of row -->
</div> <!-- end of container -->
</div> <!-- end of counter -->
<!-- end of market research -->
<!-- Video -->
<div id="preview" class="basic-1">
<div class="container">
<div class="row">
<div class="col-lg-12">
<h2>GIỚI THIỆU</h2>
<div class="p-heading p-large">Đem lại động lực, niềm vui và cảm hứng học tiếng Anh là một trong những sứ mệnh của chúng tôi</div>
</div> <!-- end of col -->
</div> <!-- end of row -->
<div class="row">
<div class="col-lg-12">
<!-- Video Preview -->
<div class="image-container">
<div class="video-wrapper">
<a class="popup-youtube" href="https://www.youtube.com/watch?fbclid=IwAR0_lzC-l7BmDcy1_shR1gqWiDc4rMDWTmWGfrtx8xn6a4aSAMeSZg4lSbY&v=ri6Dxyff67Q&feature=youtu.be" data-effect="fadeIn">
<img class="img-fluid" src="images/video-frame.png" alt="alternative">
<span class="video-play-button">
<span></span>
</span>
</a>
</div> <!-- end of video-wrapper -->
</div> <!-- end of image-container -->
<!-- end of video preview -->
</div> <!-- end of col -->
</div> <!-- end of row -->
</div> <!-- end of container -->
</div> <!-- end of basic-1 -->
<!-- end of video -->
<!-- Tính năng - Features -->
<div id="features" class="tabs">
<div class="container">
<div class="row">
<div class="col-lg-12">
<h2>TÍNH NĂNG</h2>
<div class="p-heading p-large">Raise your English được thiết kế để tối ưu hóa việc học tiếng Anh của mọi người</div>
</div> <!-- end of col -->
</div> <!-- end of row -->
<div class="row">
<!-- Tabs Links -->
<ul class="nav nav-tabs" id="lenoTabs" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="nav-tab-1" data-toggle="tab" href="#tab-1" role="tab" aria-controls="tab-1" aria-selected="true"><i class="fas fa-cog"></i>CHƠI MÀ HỌC</a>
</li>
<li class="nav-item">
<a class="nav-link" id="nav-tab-2" data-toggle="tab" href="#tab-2" role="tab" aria-controls="tab-2" aria-selected="false"><i class="fas fa-binoculars"></i>THEO DÕI TIẾN ĐỘ HỌC</a>
</li>
<li class="nav-item">
<a class="nav-link" id="nav-tab-3" data-toggle="tab" href="#tab-3" role="tab" aria-controls="tab-3" aria-selected="false"><i class="fas fa-search"></i>HỌC THEO CHỦ ĐIỂM</a>
</li>
</ul>
<!-- end of tabs links -->
<!-- Tabs Content-->
<div class="tab-content" id="lenoTabsContent">
<!-- Tab -->
<div class="tab-pane fade show active" id="tab-1" role="tabpanel" aria-labelledby="tab-1">
<div class="container">
<div class="row">
<!-- Icon Cards Pane -->
<div class="col-lg-4">
<div class="card left-pane first">
<div class="card-body">
<div class="text-wrapper">
<h4 class="card-title">Tạo động lực</h4>
<p>Biến việc học tiếng Anh vốn khô khan thành động lực.</p>
</div>
<div class="card-icon">
<i class="far fa-compass"></i>
</div>
</div>
</div>
<div class="card left-pane">
<div class="card-body">
<div class="text-wrapper">
<h4 class="card-title">Gây dựng thói quen</h4>
<p>Việc chăm lo cho English hằng ngày cũng giống như việc học tiếng Anh - liên tục và đều đặn.</p>
</div>
<div class="card-icon">
<i class="far fa-file-code"></i>
</div>
</div>
</div>
<div class="card left-pane">
<div class="card-body">
<div class="text-wrapper">
<h4 class="card-title">Kiên trì</h4>
<p>Giữ tinh thần hứng thú học tiếng Anh là tiền đề thúc đẩy sự kiên trì!</p>
</div>
<div class="card-icon">
<i class="far fa-gem"></i>
</div>
</div>
</div>
</div>
<!-- end of icon cards pane -->
<!-- Image Pane -->
<div class="col-lg-4">
<img class="img-fluid" src="images/app_images/13.png" alt="alternative">
</div>
<!-- end of image pane -->
<!-- Icon Cards Pane -->
<div class="col-lg-4">
<div class="card right-pane first">
<div class="card-body">
<div class="card-icon">
<i class="fas fa-user"></i>
</div>
<div class="text-wrapper">
<h4 class="card-title">Ghi nhớ nhanh</h4>
<p>Học qua game sẽ tăng khả năng ghi nhớ lên tới 90% sau 1 lần học.</p>
</div>
</div>
</div>
<div class="card right-pane">
<div class="card-body">
<div class="card-icon">
<i class="far fa-flag"></i>
</div>
<div class="text-wrapper">
<h4 class="card-title">Dễ học</h4>
<p>Học mà chơi, thời gian học không cần quá nhiều nhưng sự thường xuyên sẽ giúp người học nhanh tiến bộ.</p>
</div>
</div>
</div>
<div class="card right-pane">
<div class="card-body">
<div class="card-icon">
<i class="fas fa-cubes"></i>
</div>
<div class="text-wrapper">
<h4 class="card-title">Hình thức đa dạng</h4>
<p>Video, audio, ảnh, văn bản, các trò chơi tương tác đa dạng nhiều thể loại.</p>
</div>
</div>
</div>
</div>
<!-- end of icon cards pane -->
</div> <!-- end of row -->
</div> <!-- end of container -->
</div> <!-- end of tab-pane -->
<!-- end of tab -->
<!-- Tab -->
<div class="tab-pane fade" id="tab-2" role="tabpanel" aria-labelledby="tab-2">
<div class="container">
<div class="row">
<!-- Image Pane -->
<div class="col-md-4">
<img class="img-fluid" src="images/app_images/14.png" alt="alternative">
</div>
<!-- end of image pane -->
<!-- Text And Icon Cards Area -->
<div class="col-md-8">
<div class="text-area">
<h3>Tự động theo dõi trình độ tiếng Anh</h3>
<p>Bạn có thể biết được khả năng tiếng Anh hiện tại của bản thân đến đâu thông qua bài test đầu vào hoàn toàn miễn phí. Trình độ tiếng Anh của bạn chính là độ tuổi của English. Chi tiết xem tại <a class="turquoise" href="tro-choi.html">Trò chơi</a>.</p>
</div> <!-- end of text-area -->
<div class="icon-cards-area">
<div class="card">
<div class="card-icon">
<i class="fas fa-calendar-check"></i>
</div>
<div class="card-body">
<h4 class="card-title">Độ tuổi của English</h4>
<p>Phản ánh trình độ tiếng Anh của bạn theo khung tham chiếu của bộ Giáo dục và Đào tạo.</p>
</div>
</div>
<div class="card">
<div class="card-icon">
<i class="far fa-bookmark"></i>
</div>
<div class="card-body">
<h4 class="card-title">Xem lại các bài đã học</h4>
<p>Không những để thấy bạn đã tiến bộ như thế nào, mà còn giúp bạn cải thiện những điểm yếu của mình.</p>
</div>
</div>
<div class="card">
<div class="card-icon">
<i class="far fa-calendar-check"></i>
</div>
<div class="card-body">
<h4 class="card-title">Đánh giá chuyên sâu</h4>
<p>Chúng tôi khuyến khích các bạn làm bài kiểm tra định kì bằng tất cả các hình thức: nghe, nói, đọc và viết.</p>
</div>
</div>
<div class="card">
<div class="card-icon">
<i class="far fa-eye"></i>
</div>
<div class="card-body">
<h4 class="card-title">Dễ theo dõi</h4>
<p>Tuổi của English phản ánh trình độ của bạn, chi tiết về trình độ tiếng Anh theo độ tuổi xem thêm tại <a class="turquoise" href="tro-choi.html">Trò chơi</a>.</p>
</div>
</div>
</div> <!-- end of icon cards area -->
</div> <!-- end of col-md-8 -->
<!-- end of text and icon cards area -->
</div> <!-- end of row -->
</div> <!-- end of container -->
</div> <!-- end of tab-pane -->
<!-- end of tab -->
<!-- Tab -->
<div class="tab-pane fade" id="tab-3" role="tabpanel" aria-labelledby="tab-3">
<div class="container">
<div class="row">
<!-- Text And Icon Cards Area -->
<div class="col-md-8">
<div class="icon-cards-area">
<div class="card">
<div class="card-icon">
<i class="fas fa-arrows-alt"></i>
</div>
<div class="card-body">
<h4 class="card-title">Có định hướng</h4>
<p>Việc học dàn trải kém hiệu quả sẽ không còn là nỗi lo của người học.</p>
</div>
</div>
<div class="card">
<div class="card-icon">
<i class="fas fa-fighter-jet"></i>
</div>
<div class="card-body">
<h4 class="card-title">Tạo cảm hứng</h4>
<p>Học những gì mình thích là một trong những cách học hiệu quả nhất!</p>
</div>
</div>
<div class="card">
<div class="card-icon">
<i class="fas fa-book-open"></i>
</div>
<div class="card-body">
<h4 class="card-title">Nâng cao kiến thức</h4>
<p>Vừa học tiếng, vừa mở rộng nền tảng kiến thức bản thân, đó là điều tuyệt vời mà Raise your English đem lại.</p>
</div>
</div>
<div class="card">
<div class="card-icon">
<i class="far fa-bookmark"></i>
</div>
<div class="card-body">
<h4 class="card-title">Đa dạng chủ điểm</h4>
<p>Chúng tôi cung cấp cho các bạn bài học thuộc nhiều chủ điểm khác nhau như Khoa học, Công nghệ, Văn học, Điện ảnh, Âm nhạc,...</p>
</div>
</div>
</div> <!-- end of icon cards area -->
<div class="text-area">
<h3>Tìm hiểu lĩnh vực yêu thích bằng tiếng Anh</h3>
<p>Raise your English cung cấp cho mạng các bài học trên các chủ đề đa dạng thuộc nhiều lĩnh vực khác nhau. Chi tiết xem tại <a class="turquoise" href="chu-diem-tieng-anh.html"> Chủ điểm tiếng Anh</a>.</p>
</div> <!-- end of text-area -->
</div> <!-- end of col-md-8 -->
<!-- end of text and icon cards area -->
<!-- Image Pane -->
<div class="col-md-4">
<img class="img-fluid" src="images/app_images/17.png" alt="alternative">
</div>
<!-- end of image pane -->
</div> <!-- end of row -->
</div> <!-- end of container -->
</div><!-- end of tab-pane -->
<!-- end of tab -->
</div> <!-- end of tab-content -->
<!-- end of tabs content -->
</div> <!-- end of row -->
</div> <!-- end of container -->
</div> <!-- end of tabs -->
<!-- end of features -->
<!-- Details 1 -->
<div class="basic-3">
<div class="second">
<div class="container">
<div class="row">
<div class="col-lg-6">
<div class="text-container">
<h3>TRÒ CHƠI</h3>
<p>Bạn sẽ nhập vai vào một người cha hay người mẹ, nuôi dưỡng đứa bé English của bạn cho đến khi nó lớn lên. Vừa chơi vừa học là một cách tiếp cận mới và rất hiệu quả trong quá trình học.</p>
<a class="btn-solid-reg popup-with-move-anim" href="#details-lightbox-1">Chi tiết</a>
</div> <!-- end of text-container -->
</div> <!-- end of col -->
<div class="col-lg-6">
<img class="img-fluid" src="images/app_images/tro_choi_detail.png" alt="alternative">
</div> <!-- end of col -->
</div> <!-- end of row -->
</div> <!-- end of container -->
</div> <!-- end of second -->
</div> <!-- end of basic-3 -->
<!-- end of details 1 -->
<!-- Details 2 -->
<div id="details" class="basic-2">
<div class="container">
<div class="row">
<div class="col-lg-6">
<img class="img-fluid" src="images/app_images/chu_diem_detail.png" alt="alternative">
</div> <!-- end of col -->
<div class="col-lg-6">
<div class="text-container">
<h3>CHỦ ĐIỂM TIẾNG ANH</h3>
<p>Học những gì bạn thích bằng tiếng Anh sẽ tạo cho bạn nguồn động lực.</p>
<a class="btn-solid-reg popup-with-move-anim" href="#details-lightbox-2">Chi tiết</a>
</div> <!-- end of text-container -->
</div> <!-- end of col -->
</div> <!-- end of row -->
</div> <!-- end of container -->
</div> <!-- end of basic-2 -->
<!-- end of details 2 -->
<!-- Details 3 -->
<div class="basic-3">
<div class="second">
<div class="container">
<div class="row">
<div class="col-lg-6">
<div class="text-container">
<h3>TÍNH CÁ NHÂN HÓA</h3>
<p>Học theo những gì bạn muốn, theo trình độ của bạn.</p>
<a class="btn-solid-reg popup-with-move-anim" href="#details-lightbox-3">Chi tiết</a>
</div> <!-- end of text-container -->
</div> <!-- end of col -->
<div class="col-lg-6">
<img class="img-fluid" src="images/app_images/tinh_ca_nhan_hoa_detail.png" alt="alternative">
</div> <!-- end of col -->
</div> <!-- end of row -->
</div> <!-- end of container -->
</div> <!-- end of second -->
</div> <!-- end of basic-3 -->
<!-- end of details 3 -->
<!-- Details Lightboxes -->
<!-- Lightbox -->
<div id="details-lightbox-1" class="lightbox-basic zoom-anim-dialog mfp-hide">
<div class="row">
<button title="Close (Esc)" type="button" class="mfp-close x-button">×</button>
<div class="col-lg-6">
<img class="img-fluid" src="images/app_images/10.png" alt="alternative">
</div>
<div class="col-lg-6">
<h3>Trò chơi</h3>
<hr>
<p>Người học có thể trải nghiệm "niềm vui" trong trò chơi và học rất hiệu quả. "Trò chơi hóa việc học" sẽ là xu hướng của thời đại.</p>
<p>Lợi ích của trò chơi trong việc học:</p>
<table>
<tr><td class="icon-cell"><i class="fas fa-hand-holding-heart"></i></td><td>Tăng sự thích thú</td></tr>
<tr><td class="icon-cell"><i class="fas fa-home"></i></td><td>Quen thuộc</td></tr>
<tr><td class="icon-cell"><i class="fas fa-calendar"></i></td><td>Tạo thói quen</td></tr>
</table>
<a class="btn-solid-reg" href="tro-choi.html">CHI TIẾT</a> <a class="btn-outline-reg mfp-close as-button" href="#details">QUAY LẠI</a>
</div>
</div> <!-- end of row -->
</div> <!-- end of lightbox-basic -->
<!-- end of lightbox -->
<!-- Lightbox -->
<div id="details-lightbox-2" class="lightbox-basic zoom-anim-dialog mfp-hide">
<div class="row">
<button title="Close (Esc)" type="button" class="mfp-close x-button">×</button>
<div class="col-lg-6">
<img class="img-fluid" src="images/app_images/17.png" alt="alternative">
</div>
<div class="col-lg-6">
<h3>Chủ điểm tiếng Anh</h3>
<hr>
<p>Không phải ai cũng thích học theo cách mà người viết sách hay giáo trình thường nghĩ.</p>
<h4>Tại sao chúng tôi lại chọn phương thức này?</h4>
<p>Sau khi nghiên cứu và thử nghiệm, chúng tôi nhận ra rằng việc học tiếng Anh theo các môn học, lĩnh vực mà mình yêu thích sẽ tạo một cảm hứng học mạnh mẽ. Đây là một phương pháp rất hay giúp mỗi người tự học tiếng Anh hiệu quả.</p>
<p>Các chủ điểm tiếng Anh có trong app:</p>
<table>
<tr><td class="icon-cell"><i class="fas fa-flask"></i></td><td>Khoa học</td></tr>
<tr><td class="icon-cell"><i class="fas fa-music"></i></td><td>Âm nhạc</td></tr>
<tr><td class="icon-cell"><i class="fas fa-camera-retro"></i></td><td>Điện ảnh</td></tr>
<tr><td class="icon-cell"><i class="fas fa-envelope"></i></td><td>Văn học</td></tr>
<tr><td class="icon-cell"><i class="fas fa-history"></i></td><td>Lịch sử</td></tr>
<tr><td class="icon-cell"><i class="fas fa-code"></i></td><td>Công nghệ</td></tr>
<tr><td>...</td></tr>
</table>
<a class="btn-solid-reg" href="chu-diem-tieng-anh.html">CHI TIẾT</a> <a class="btn-outline-reg mfp-close as-button" href="#details">QUAY LẠI</a>
</div>
</div> <!-- end of row -->
</div> <!-- end of lightbox-basic -->
<!-- end of lightbox -->
<!-- Lightbox -->
<div id="details-lightbox-3" class="lightbox-basic zoom-anim-dialog mfp-hide">
<div class="row">
<button title="Close (Esc)" type="button" class="mfp-close x-button">×</button>
<div class="col-lg-6">
<img class="img-fluid" src="images/app_images/18.png" alt="alternative">
</div>
<div class="col-lg-6">
<h3>Tính cá nhân hóa</h3>
<hr>
<p>Một điều quan trọng khi học tiếng Anh là học đúng trình độ. Mỗi người sẽ có một trình độ tiếng Anh và khả năng tiếp nhận ngôn ngữ khác nhau nên khi học không phải ai cũng có thể theo được một giáo trình cụ thể</p>
<h4>Đó là lí do tại sao...</h4>
<p>Chúng tôi tạo ra một số lượng lớn và đa dạng các bài học, phù hợp với đa dạng trình độ.</p>
<p>Trong app của chúng tôi, các bạn sẽ:</p>
<table>
<tr><td class="icon-cell"><i class="fas fa-thumbs-up"></i></td><td>Học theo sở thích</td></tr>
<tr><td class="icon-cell"><i class="fas fa-heart"></i></td><td>Học theo năng lực</td></tr>
<tr><td class="icon-cell"><i class="fas fa-bullhorn"></i></td><td>Không bị gò bó bởi giáo trình cứng nhắc</td></tr>
<tr><td class="icon-cell"><i class="fas fa-male"></i></td><td>Học bằng đa giác quan</td></tr>
</table>
<a class="btn-solid-reg" href="tinh-ca-nhan-hoa.html">CHI TIẾT</a> <a class="btn-outline-reg mfp-close as-button" href="#details">QUAY LẠI</a>
</div>
</div> <!-- end of row -->
</div> <!-- end of lightbox-basic -->
<!-- end of lightbox -->
<!-- end of details lightboxes -->
<!-- Screenshots -->
<div class="slider-2">
<div class="container">
<div class="row">
<div class="col-lg-12">
<!-- Image Slider -->
<div class="slider-container">
<div class="swiper-container image-slider">
<div class="swiper-wrapper">
<!-- Slide -->
<div class="swiper-slide">
<a href="images/app_images/1.png" class="popup-link" data-effect="fadeIn">
<img class="img-fluid" src="images/app_images/1.png" alt="alternative">
</a>
</div>
<!-- end of slide -->
<!-- Slide -->
<div class="swiper-slide">
<a href="images/app_images/2.png" class="popup-link" data-effect="fadeIn">
<img class="img-fluid" src="images/app_images/2.png" alt="alternative">
</a>
</div>
<!-- end of slide -->
<!-- Slide -->
<div class="swiper-slide">
<a href="images/app_images/3.png" class="popup-link" data-effect="fadeIn">
<img class="img-fluid" src="images/app_images/3.png" alt="alternative">
</a>
</div>
<!-- end of slide -->
<!-- Slide -->
<div class="swiper-slide">
<a href="images/app_images/4.png" class="popup-link" data-effect="fadeIn">
<img class="img-fluid" src="images/app_images/4.png" alt="alternative">
</a>
</div>
<!-- end of slide -->
<!-- Slide -->
<div class="swiper-slide">
<a href="images/app_images/5.png" class="popup-link" data-effect="fadeIn">
<img class="img-fluid" src="images/app_images/5.png" alt="alternative">
</a>
</div>
<!-- end of slide -->
<!-- Slide -->
<div class="swiper-slide">
<a href="images/app_images/6.png" class="popup-link" data-effect="fadeIn">
<img class="img-fluid" src="images/app_images/6.png" alt="alternative">
</a>
</div>
<!-- end of slide -->
<!-- Slide -->
<div class="swiper-slide">
<a href="images/app_images/7.png" class="popup-link" data-effect="fadeIn">
<img class="img-fluid" src="images/app_images/7.png" alt="alternative">
</a>
</div>
<!-- end of slide -->
<!-- Slide -->
<div class="swiper-slide">
<a href="images/app_images/8.png" class="popup-link" data-effect="fadeIn">
<img class="img-fluid" src="images/app_images/8.png" alt="alternative">
</a>
</div>
<!-- end of slide -->
<!-- Slide -->
<div class="swiper-slide">
<a href="images/app_images/9.png" class="popup-link" data-effect="fadeIn">
<img class="img-fluid" src="images/app_images/9.png" alt="alternative">
</a>
</div>
<!-- end of slide -->
<!-- Slide -->
<div class="swiper-slide">
<a href="images/app_images/20.png" class="popup-link" data-effect="fadeIn">
<img class="img-fluid" src="images/app_images/20.png" alt="alternative">
</a>
</div>
<!-- Slide -->
<div class="swiper-slide">
<a href="images/app_images/10.png" class="popup-link" data-effect="fadeIn">
<img class="img-fluid" src="images/app_images/10.png" alt="alternative">
</a>
</div>
<!-- Slide -->
<div class="swiper-slide">
<a href="images/app_images/11.png" class="popup-link" data-effect="fadeIn">
<img class="img-fluid" src="images/app_images/11.png" alt="alternative">
</a>
</div>
<!-- Slide -->
<div class="swiper-slide">
<a href="images/app_images/12.png" class="popup-link" data-effect="fadeIn">
<img class="img-fluid" src="images/app_images/12.png" alt="alternative">
</a>
</div>
<!-- Slide -->
<div class="swiper-slide">
<a href="images/app_images/13.png" class="popup-link" data-effect="fadeIn">
<img class="img-fluid" src="images/app_images/13.png" alt="alternative">
</a>
</div>
<!-- Slide -->
<div class="swiper-slide">
<a href="images/app_images/14.png" class="popup-link" data-effect="fadeIn">
<img class="img-fluid" src="images/app_images/14.png" alt="alternative">
</a>
</div>
<!-- Slide -->
<div class="swiper-slide">
<a href="images/app_images/15.png" class="popup-link" data-effect="fadeIn">
<img class="img-fluid" src="images/app_images/15.png" alt="alternative">
</a>
</div>
<!-- Slide -->
<div class="swiper-slide">
<a href="images/app_images/16.png" class="popup-link" data-effect="fadeIn">
<img class="img-fluid" src="images/app_images/16.png" alt="alternative">
</a>
</div>
<!-- Slide -->
<div class="swiper-slide">
<a href="images/app_images/17.png" class="popup-link" data-effect="fadeIn">
<img class="img-fluid" src="images/app_images/17.png" alt="alternative">
</a>
</div>
<!-- Slide -->
<div class="swiper-slide">
<a href="images/app_images/18.png" class="popup-link" data-effect="fadeIn">
<img class="img-fluid" src="images/app_images/18.png" alt="alternative">
</a>
</div>
<!-- Slide -->
<div class="swiper-slide">
<a href="images/app_images/19.png" class="popup-link" data-effect="fadeIn">
<img class="img-fluid" src="images/app_images/19.png" alt="alternative">
</a>
</div>
<!-- end of slide -->
</div> <!-- end of swiper-wrapper -->
<!-- Add Arrows -->
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
<!-- end of add arrows -->
</div> <!-- end of swiper-container -->
</div> <!-- end of slider-container -->
<!-- end of image slider -->
</div> <!-- end of col -->
</div> <!-- end of row -->
</div> <!-- end of container -->
</div> <!-- end of slider-2 -->
<!-- end of screenshots -->
<!-- Download -->
<div class="basic-4">
<div class="container">
<div class="row">
<div class="col-lg-6 col-xl-5">
<div class="text-container">
<h2>Hãy ủng hộ <span class="blue">Raise your English</span></h2>
<p class="p-large">Hiện app đang trong quá trình hình thành ý tưởng, nếu các bạn cảm thấy ứng dụng là thiết thực, đừng ngần ngại ủng hộ cho chúng mình nhé! </p>
<a class="btn-solid-lg page-scroll" href="#preview"><i class="fas fa-info"></i> GIỚI THIỆU</a>
<a class="btn-solid-lg" href="https://xd.adobe.com/view/f9989f2f-a21f-4c59-87bb-95961f4baa84-accb/?fullscreen&hints=off" target="_blank"><i class="fas fa-box"></i> DEMO</a>
</div> <!-- end of text-container -->
</div> <!-- end of col -->
<div class="col-lg-6 col-xl-7">
<div class="image-container">
<img class="img-fluid" src="images/app_images/3-in-1.png" alt="alternative">
</div> <!-- end of img-container -->
</div> <!-- end of col -->
</div> <!-- end of row -->
</div> <!-- end of container -->
</div> <!-- end of basic-4 -->
<!-- end of download -->
<!-- Contact -->
<div id="contact" class="form">
<div class="container">
<div class="row">
<div class="col-lg-12">
<h2>LIÊN HỆ</h2>
<ul class="list-unstyled li-space-lg">
<li class="address">Đừng ngần ngại để lại lời nhắn cho chúng tôi! Mỗi đóng góp của bạn đều vô cùng quý giá và là động lực để chúng tôi cải thiện sản phẩm của mình!</li>
<li><i class="fas fa-map-marker-alt"></i>Số 1 Đại Cồ Việt, Hai Bà Trưng, Hà Nội</li>
<li><i class="fas fa-phone"></i><a class="blue" href="tel:+84949866908">+84 949 866 908</a></li>
<li><i class="fas fa-envelope"></i><a class="blue" href="mailto:[email protected]">[email protected]</a></li>
</ul>
</div> <!-- end of col -->
</div> <!-- end of row -->
<div class="row">
<div class="col-lg-6 offset-lg-3">
<!-- Contact Form -->
<form id="contactForm" data-toggle="validator" data-focus="false">
<div class="form-group">
<input type="text" class="form-control-input" id="cname" required>
<label class="label-control" for="cname">Họ tên</label>
<div class="help-block with-errors"></div>
</div>
<div class="form-group">
<input type="email" class="form-control-input" id="cemail" required>
<label class="label-control" for="cemail">Email</label>
<div class="help-block with-errors"></div>
</div>
<div class="form-group">
<textarea class="form-control-textarea" id="cmessage" required></textarea>
<label class="label-control" for="cmessage">Lời nhắn của bạn</label>
<div class="help-block with-errors"></div>
</div>
<!--
<div class="form-group checkbox">
<input type="checkbox" id="cterms" value="Agreed-to-Terms" required>Tôi sẵn sàng phản ánh đúng sự thật về <a href="tro-choi.html">Trò chơi</a> và <a href="chu-diem-tieng-anh.html">Các chủ điểm</a>
<div class="help-block with-errors"></div>
</div>
-->
<div class="form-group">
<button type="submit" class="form-control-submit-button">GỬI</button>
</div>
<div class="form-message">
<div id="cmsgSubmit" class="h3 text-center hidden"></div>
</div>
</form>
<!-- end of contact form -->
</div> <!-- end of col -->
</div> <!-- end of row -->
</div> <!-- end of container -->
</div> <!-- end of form -->
<!-- end of contact -->
<!-- Footer -->
<div class="footer">
<div class="container">
<div class="row">
<div class="col-md-4">
<div class="footer-col">
<h4>Về XTeam</h4>
<p>Chúng tôi muốn tạo ra những giá trị quý báu nhất cho cộng đồng!</p>
</div>
</div> <!-- end of col -->
<div class="col-md-4">
<div class="footer-col middle">
<h4>Đường dẫn</h4>
<ul class="list-unstyled li-space-lg">
<li class="media">
<i class="fas fa-square"></i>
<div class="media-body">CLB của chúng tôi <a class="turquoise" href="https://www.facebook.com/hiec.vn" target="_blank">HIEC</a></div>
</li>
<li class="media">
<i class="fas fa-square"></i>
<div class="media-body">Đọc về <a class="turquoise" href="tro-choi.html">Trò chơi</a> và <a class="turquoise" href="chu-diem-tieng-anh.html">Chủ điểm tiếng anh</a></div>
</li>
</ul>
</div>
</div> <!-- end of col -->
<div class="col-md-4">
<div class="footer-col last">
<h4>Kênh truyền thông</h4>
<span class="fa-stack">
<a href="https://www.facebook.com/Raise-Your-English-104075271602316/" target="_blank">
<i class="fas fa-circle fa-stack-2x"></i>
<i class="fab fa-facebook-f fa-stack-1x"></i>
</a>
</span>
<span class="fa-stack">