-
Notifications
You must be signed in to change notification settings - Fork 3
Expand file tree
/
Copy pathLandingPage.html
More file actions
1607 lines (1477 loc) · 94.6 KB
/
LandingPage.html
File metadata and controls
1607 lines (1477 loc) · 94.6 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 ng-app="v3App" lang="en">
<head>
<meta charset="utf-8">
<link href="./img/favicon.png" rel="icon">
<!-- UPDATE TEMPLATE 1 -->
<title>CodingMinds编程思维</title>
<meta name="keywords" content="Arduino, Arduino编程, C语言, 青少年编程, 课后编程辅导, 编程思维, 编程竞赛">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- UPDATE TEMPLATE 2 -->
<meta name="description" content="制作智能电子系统，在硬件的世界学习软件">
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
<link href="css/stack-interface.css" rel="stylesheet" type="text/css" media="all" />
<link href="css/socicon.css" rel="stylesheet" type="text/css" media="all" />
<link href="css/lightbox.min.css" rel="stylesheet" type="text/css" media="all" />
<link href="css/flickity.css" rel="stylesheet" type="text/css" media="all" />
<link href="css/iconsmind.css" rel="stylesheet" type="text/css" media="all" />
<link href="css/jquery.steps.css" rel="stylesheet" type="text/css" media="all" />
<link href="css/theme.css" rel="stylesheet" type="text/css" media="all" />
<link href="css/custom.css" rel="stylesheet" type="text/css" media="all" />
<link href="css/angular-material.min.css" rel="stylesheet" type="text/css" media="all" />
<link href="https://fonts.googleapis.com/css?family=Open+Sans:200,300,400,400i,500,600,700%7CMerriweather:300,300i%7CMaterial+Icons" rel="stylesheet">
<link href="CSS/index-cn.css" rel="stylesheet">
<link rel="icon" href="https://codingmindsacademy.com/img/my/logofav.png" mce_href="/https://codingmindsacademy.com/img/my/logofav.png" type="image/x-icon">
<link rel="shortcut icon" href="https://codingmindsacademy.com/img/my/logofav.png" mce_href="/favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="https://codingmindsacademy.com/img/my/logofav.png" mce_href="/favicon.ico" type="image/x-icon">
<link rel="apple-touch-icon" sizes="57x57" href="https://codingmindsacademy.com/img/my/logofav.png" />
<link rel="apple-touch-icon" sizes="72x72" href="https://codingmindsacademy.com/img/my/logofav.png" />
<link rel="apple-touch-icon" sizes="114x114" href="https://codingmindsacademy.com/img/my/logofav.png" />
<link rel="apple-touch-icon" sizes="144x144" href="https://codingmindsacademy.com/img/my/logofav.png" />
<STYLE type="text/css">
#flwindow0{position: absolute; left: 0%}
#flwindow1{position: absolute; left: 100%}
#flwindow2{position: absolute; left: 200%}
#flwindow3{position: absolute; left: 300%}
#flwindow4{position: absolute; left: 400%}
#flwindow5{position: absolute; left: 500%}
#flwindow6{position: absolute; left: 600%}
#flwindow7{position: absolute; left: 700%}
#flwindow8{position: absolute; left: 800%}
</STYLE>
<style>
/* Default hide the video on all devices */
#video2{display:none}
/* Default display the image to replace the video on all devices */
#videosubstitute{}
/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
#video2{display:block;}
#videosubstitute{display:none}
}
#videoDiv2 {width: 100%; margin:auto; display:block; position: relative;}
#video2{width: 100%;}
#videoMessage2 {padding:0.4em;}
#videoMessage2 {text-shadow: 2px 2px 2px #000000;color:white;z-index:99 }
#videoMessage2 h1{font-size: 2em;color:#ffffff;text-align:center;margin: 0.25em;}
#videoMessage2 h2{font-size: 1.5em;color:#ffffff;text-align:center;margin: 0.25em;}
#videoMessage2 h3{font-size: 1.3em;color:#ffffff;text-align:center;margin: 0.25em;}
#videoMessageBox2 {
position: absolute; top: 0; left: 0;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
width: 100%;
height:100%;
}
#videoMessage2 {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
width: 100%;
}
i[title]:hover:after {
content: attr(title);
font-size: 20px;
border: black 1px;
background-color: #DCDCDC;
padding: 1px 20px 5px 5px;
display: block;
z-index: 100;
left: 0px;
margin-top: 30px;
position: absolute;
top: 10px;
}
.float-right {
position: fixed;
font-size: 2em;
padding-left: 0.7em;
padding-right: 0.7em;
padding-top: 1em;
padding-bottom: 1em;
right: 100px;
bottom: 15%;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
box-shadow: 0px 0px 25px 0px rgba(0, 0, 0, 0.04);
z-index: 99;
border: 1px solid #ececec;
transition: 0.2s ease-out;
-webkit-transition: 0.2s ease-out;
-moz-transition: 0.2s ease-out;
/*writing-mode : tb-rl;*/
transform: translate(30%)
}
@media only screen and (max-width : 667px) {
.float-right {
position: fixed;
font-size: 1.2em;
padding-left: 0.7em;
padding-right: 0.7em;
padding-top: 1em;
padding-bottom: 1em;
right: 28px;
bottom: 5%;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
box-shadow: 0px 0px 25px 0px rgba(0, 0, 0, 0.04);
z-index: 99;
border: 1px solid #ececec;
transition: 0.2s ease-out;
-webkit-transition: 0.2s ease-out;
-moz-transition: 0.2s ease-out;
/*writing-mode : tb-rl;*/
transform: translate(30%)
}
#contact-icon{display: none}
#h-block{display: none};
}
</style>
<style>
.underline-small {
color: #fafafa;
display: inline-block;
position: relative;
}
.underline-small::after {
content: '';
height: 1.5px;
width: 20%;
position: absolute;
background: #fafafa;
left: calc(50% - 10%);
bottom: -3.5px;
}
.col-3 {
column-count: 3;
}
.shike-num {
margin-left: 75px;
font-size: 70px;
color: #4A90E2;
opacity: 50%;
}
.shike-txt {
position: relative;
top: -90px;
font-size: 55px;
margin-left: 105px;
}
.shike-subtxt {
position: relative;
top: -80px;
font-size: 25px;
max-width: 300px;
margin-left: 108px;
}
</style>
<div style='margin:0 auto;display:none;'>
<img src="https://codingmindsacademy.com/img/my/logofav.png" />
</div>
</head>
<body ng-controller="signup_trialcourse_homepage">
<a id="start"></a>
<div class="nav-container">
<div class="bar bar--sm visible-xs">
<div class="container">
<div class="row">
<div class="col-xs-3 col-sm-2">
<a href="index.html">
<img class="logo logo-dark" alt="logo" src="img/my/logo1.png" />
<img class="logo logo-light" alt="logo" src="img/my/logo1.png" />
</a>
</div>
<div class="col-xs-9 col-sm-10 text-right">
<a href="#" class="hamburger-toggle" data-toggle-class="#menu1;hidden-xs">
<i class="icon icon--sm stack-interface stack-menu"></i>
</a>
</div>
</div>
<!--end of row-->
</div>
<!--end of container-->
</div>
<nav id="menu1" class="bar bar-1 hidden-xs">
<div class="container">
<div class="row">
<div class="col-md-1 col-sm-2 hidden-xs">
<div class="bar__module">
<a href="index-cn.html"> <img class="logo logo-dark" alt="logo" src="img/my/logo1.png"> <img class="logo logo-light" alt="logo" src="img/my/logo1.png"> </a>
</div>
</div>
<div class="col-md-11 col-sm-12 text-right text-left-xs text-left-sm">
<div class="bar__module">
<ul class="menu-horizontal text-left">
<li>
<a href="index-cn.html">
关于我们
</a>
</li>
<li>
<a href="pathc.html">
课程体系
</a>
</li>
<li>
<a href="enrichmentc.html">
背景提升
</a>
</li>
<li>
<a href="conferencec.html">
学生作品
</a>
</li>
<li>
<a href="#">
师资力量
</a>
</li>
</ul>
</div>
<div class="bar__module">
<!-- <a class="btn btn--sm type--uppercase" href="#customise-template"> <span class="btn__text">
Contact Us
</span> </a> -->
<a class="btn btn--sm btn--primary type--uppercase" href="https://www.sharemyworks.com"> <span class="btn__text">
学习中心
</span> </a>
</div>
</div>
</div>
</div>
</nav>
</div>
<section class="imagebg videobg height-60 text-center" data-overlay="4" id="video2">
<video autoplay loop muted>
<source src="video/video1.webm" type="video/webm">
<source src="video/video1.mp4" type="video/mp4">
<source src="video/video1.ogv" type="video/ogv">
</video>
<div class="background-image-holder">
<img alt="image" src="img/main.jpg"/>
</div>
<div id="videoMessageBox2">
<div id="videoMessage2">
<h1 class="spacer" style = "font-size: 65px">
编程助力名校申请
</h1>
<div class="typed-headline">
<h1 class="h1 spacer" style = "font-size: 45px">K-12编程教育，项目核心背景提升助力私高、大学申请</span>
</div>
<br/>
<div class="typed-headline">
<h1 class="h1 spacer" style = "font-size: 35px">Coding Minds编程课程体系由美国大学计算机教授团队从美国大学申请的角度设计，进阶性的学习编程，培养兴趣和实践能力，让孩子从小打下坚实的编程基础</span>
</div>
<br>
</div>
</div>
</section>
<!--section id="video2">
<div id="videoDiv2">
<div id="videoBlock2">
<video id="video2" preload autoplay muted playsinline loop>
<source src="video/video.mp4" type="video/mp4">
<source src="video/video.webm" type="video/webm">
<source src="video/video.ogv" type="video/ogv">
</video>
<div id="videoMessageBox2">
<div id="videoMessage2">
<h1 class="spacer" style = "font-size: 65px">
编程助力名校申请
</h1>
<div class="typed-headline">
<h1 class="h1 spacer" style = "font-size: 45px">K-12编程课堂带你走向美国名校</span>
</div>
<br/>
<div class="typed-headline">
<h1 class="h1 spacer" style = "font-size: 45px">竞赛 科研 发布 创业</span>
</div>
<br>
<div style = "text-align: center;">
<a class="btn btn--primary type--uppercase" href="#">
<span class="btn__text">
点击试课
</span>
</a>
</div>
</div>
</div>
</div>
</div>
</section-->
<section class="text-center height-80 imagebg" data-overlay="4" id="videosubstitute">
<div class="background-image-holder" style="background: url("img/main.jpg"); opacity: 1;">
<img alt="background" src="img/main.jpg">
</div>
<div class="container pos-vertical-center">
<div class="row">
<div class="col-sm-12">
<h1 style = "font-size: 65px">
编程助力名校申请
</h1>
<div class="typed-headline">
<h1 class="h1 inline-block" style = "font-size: 45px">K-12编程教育，项目核心背景提升助力私高、大学申请</span>
</div>
<br/>
<div class="typed-headline">
<h1 class="h1 inline-block" style = "font-size: 35px">Coding Minds编程课程体系由美国大学计算机教授团队从美国大学申请的角度设计，进阶性的学习编程，培养兴趣和实践能力，让孩子从小打下坚实的编程基础</span>
</div>
<!--div>
<span class="h1 inline-block typed-text typed-text--cursor color--primary" data-typed-strings="竞赛,科研,发布,创业" style = "font-size: 50, color: white"></span>
</div-->
</div>
</div>
<!--end of row-->
</div>
<!--end of container-->
</section>
<section id="whycoding" class="text-center">
<div class="container">
<div class="row">
<div class="col-sm-10 col-md-8">
<h1 style = "font-size: 60">Coding Minds提供<a href="https://codingmindsacademy.com/minecodec.html" target="_blank">MineCraft</a>、<a href="https://codingmindsacademy.com/scratchc.html" target="_blank">Scratch</a>、<a href="https://codingmindsacademy.com/roblox1c.html" target="_blank">Roblox</a>、
<a href="https://codingmindsacademy.com/pythonc2.html" target="_blank">Python</a>、<a href="https://codingmindsacademy.com/pathc.html" target="_blank">Java</a>、<br><a href="https://codingmindsacademy.com/pathc.html" target="_blank">C</a>、<a href="https://codingmindsacademy.com/pathc.html" target="_blank">C++</a>、
<a href="https://codingmindsacademy.com/ioic.html" target="_blank">USACO</a>、<a href="https://codingmindsacademy.com/apcs-cn.html" target="_blank">AP CS</a>等多种<br>编程类相关课程。</h2>
</div>
</div>
</div>
</section>
<section class="text-center">
<div class="row">
<div id = "h-block"class="col-sm-3" style="color: white">
1
</div>
<form class="form-horizontal" style = "margin: 10px">
<div class="col-sm-4">
<input type="email" required ng-model='form.email'name="Email" placeholder="请输入邮箱获取机构详情"/>
</div>
<div class="col-sm-1">
<button type="submit" ng-click="submit1()" class="btn btn--primary type--uppercase">获取详情</button>
</div>
<div class="col-sm-1">
<!-- <textarea cols="12" rows="1" id="phone" >(949)6789790</textarea> -->
<!-- <input type="button" onClick="copyphone()" value="复制电话" /> -->
<!-- <textarea cols="30" rows="1" id="email" >contact@codingmindsacademy.com</textarea> -->
<!-- <input type="button" onClick="copyemail()" value="复制邮箱" /> -->
<!-- <i style= "padding-right:20px;" id = "phone" class="icon icon--sm icon-Phone-2 icon--xm" title="(949) 236-7896" type="button" onClick="copyphone()"></i> -->
<i style= "padding-right:20px;" id = "phoneicon" class="icon icon--sm icon-Phone-2 icon--xm" title="(949) 236-7896" type="button" onClick="copyphone()"></i>
<i id = "emailicon" class="icon icon--sm icon-Email icon--xm" title="contact@codingmindsacademy.com" type="button" onClick="copyemail()"> </i>
</div>
<div class="col-sm-1">
</div>
</form>
</div>
</section>
<section class="switchable bg--secondary">
<div class="container">
<div class="row">
<div class="col-sm-6">
<ul class="accordion accordion--oneopen accordion-2 switchable__text" style="height: 400px;">
<li class="active">
<div class="accordion__title">
<span class="h1">关于我们</span>
</div>
<div class="accordion__content">
<p class="lead" style = "font-size: 60">
编程思维学院（Coding Minds，Inc.）成立于2017年，总部坐落于美丽的加州城市尔湾，“编程助力名校申请”创造者，是K-12编程课程供应商，
主要致力于提供各种基础编程课、私立高中申请背景提升项目、大学申请背景提升项目。课程包括：<a href="https://codingmindsacademy.com/minecodec.html" target="_blank">MineCraft</a>、<a href="https://codingmindsacademy.com/scratchc.html" target="_blank">Scratch</a>、<a href="https://codingmindsacademy.com/roblox1c.html" target="_blank">Roblox</a>、
<a href="https://codingmindsacademy.com/pythonc2.html" target="_blank">Python</a>、<a href="https://codingmindsacademy.com/pathc.html" target="_blank">Java</a>、<a href="https://codingmindsacademy.com/pathc.html" target="_blank">C</a>、<a href="https://codingmindsacademy.com/pathc.html" target="_blank">C++</a>、
<a href="https://codingmindsacademy.com/ioic.html" target="_blank">USACO辅导</a>、<a href="https://codingmindsacademy.com/apcs-cn.html" target="_blank">AP CS课程辅导</a>。<br>
作为尔湾学区编程课程提供商，Coding Minds已经与洛杉矶、芝加哥、纽约、达拉斯、休斯顿等多地学区和After school合作提供K-12编程课程。
</p>
</div>
</li>
<li>
<div class="accordion__title">
<span class="h1">办学理念</span>
</div>
<div class="accordion__content">
<p class="lead">
信息技术高速发展的现代，每个人都需要有一定的编程知识，人工智能必将是未来各个领域不可逆的发展趋势。如同多年以前英语教育因全球化进程而飞速普及，编程也会像英语一样成为一项不可或缺的技能。为了赢得未来，谁能提前掌握编程技能，谁就将是时代的领先者。
学习编程并不就一定为了成为程序员，K-12的孩子学习编程，也并不仅是为了以后从事相关专业的工作，Coding Minds从教育、启蒙的角度来设计编程课程，把计算机语言做为成长中的基础知识进行培养，将编程思维打造为与视听读写、逻辑表达、数学运算相同的基础思维。
</p>
</div>
</li>
<li>
<div class="accordion__title">
<span class="h1">招生范围</span>
</div>
<div class="accordion__content">
<p class="lead">
Coding Minds 面向K-12同学提供不同等级的<a href="https://codingmindsacademy.com/pathc.html" target="_blank">编程课程</a>，并为初高中和大学同学提供目标为名校申请的<a href="https://codingmindsacademy.com/pathc.html" target="_blank">背景提升项目</a>。
</p>
</div>
</li>
</ul>
<!--end accordion-->
</div>
<div class="col-md-5 col-sm-6">
<img alt="Image" class="border--round box-shadow-wide" src="img/codingmindsTrial.jpg">
</div>
</div>
<!--end of row-->
</div>
<!--end of container-->
</section>
<section class="text-center bg">
<div class="container">
<div class="row">
<div class="col-sm-10 col-md-8">
<span class="h1">在竞赛中锻炼与提高</span>
<p class="lead">
Coding Minds 每年组织同学至少要参加2次计算机和科学竞赛
竞赛在给同学们提供目标，开阔眼界的同时，也帮助同学们锻炼综合素质，获得名校申请的信心
</p>
</div>
</div>
<!--end of row-->
</div>
<!--end of container-->
</section>
<section class="imagebg height-50">
<div class="background-image-holder" style="background: url("img/academia-3.jpg"); opacity: 1;">
<img src="img/academia-3.jpg" alt="bg">
</div>
</section>
<section class="text-center">
<div class="container">
<div class="row">
<div class="col-sm-10 col-md-8">
<span class="h1">不断挑战科研与创新</span>
<p class="lead">
学院科研方向涵盖人工智能，大数据，移动开发，算法，物联网，网络开发等多个领域
</p>
</div>
</div>
<!--end of row-->
</div>
<!--end of container-->
</section>
<section class="imagebg">
<div class="background-image-holder" style="background: url("img/academia-4.jpg"); opacity: 1;">
<img alt="background" src="img/academia-4.jpg">
</div>
<div class="container">
<div class="row">
<div class="col-sm-7 col-md-5 col-sm-offset-5 col-md-offset-7">
<div class="boxed boxed--lg border--round bg--white">
<div class="col-md-10 col-md-offset-1 col-sm-12">
<h3>科研从中学生开始</h3>
<p class="lead">
编程思维的同学最早在5年级就可以熟练掌握运用人工智能与神经网络，8年级便可以进行科研试验并发表国际会议论文
</p>
<hr class="short">
<p>
美国顶尖高校科研导师 独有的一对一科研指导方法 帮同学实现属于自己的理想
</p>
</div>
</div>
</div>
</div>
<!--end of row-->
</div>
<!--end of container-->
</section>
<section class="text-center">
<div class="container">
<div class="row">
<div class="col-sm-10 col-md-8">
<span class="h1">创业之旅 始于少年</span>
<p class="lead">
从零开始完成实践创业的全过程。除过技术，还能收获丰富的履历和综合素质的提升。
</p>
</div>
</div>
<!--end of row-->
</div>
<!--end of container-->
</section>
<section class="text-center imagebg" data-overlay="4">
<div class="background-image-holder" style="background: url("img/project-2.jpg"); opacity: 1;">
<img alt="background" src="img/project-2.jpg">
</div>
<div class="container">
<div class="row">
<div class="col-sm-8 col-sm-offset-2 col-md-6 col-md-offset-3">
<div class="cta">
<h2>解决与自身息息相关的问题</h2>
<p class="lead">
学院提供多门实战开发课程，保证同学能出色的完成研发。同时用最丰富的创业经验，帮助同学申请专利，成立公司，寻求投资
</p>
<br>
<br>
</div>
</div>
</div>
<!--end of row-->
</div>
<!--end of container-->
</section>
<section class="text-center bg--secondary">
<div class="container">
<div class="row">
<div class="col-sm-10 col-md-8">
<span class="h1"><a href="https://www.youtube.com/channel/UCF-K1DZ5lk8Bqn-14JF99jA/videos" target="_blank">发布作品 保留记录</a></span>
<p class="lead">
日日奋笔，华章自成。Coding Minds要求同学发布并保留自己的每一个项目，记录自己成长的同时，为以后的升学做好准备，提供素材。
</p>
</div>
</div>
<!--end of row-->
</div>
<!--end of container-->
</section>
<section class="cover imagebg height-80 text-center" data-overlay="3">
<div class="background-image-holder" style="background: url("img/volunteer-3.jpg"); opacity: 1;">
<img alt="background" src="img/volunteer-3.jpg">
</div>
<div class="container pos-vertical-center">
<div class="row">
<div class="col-sm-12">
<span class="h1 inline-block">每个同学</span>
<span class="h1 inline-block typed-text typed-text--cursor" data-typed-strings="每一小节,每一门课,每一学期">urban hide</span>
<p class="lead" style="font-size:40px">
都要做出自己的编程作品
</p>
<!--p style="font-size:20px">
作品大量发布在移动端 网络端 游戏客户端等 保证流量和知名度
</p>
<p style="font-size:20px">
作品作为升学时的有力支持 在名校申请当中发挥重要作用
</p-->
</div>
</div>
<!--end of row-->
</div>
<!--end of container-->
</section>
<section class="text-center">
<div class="container">
<div class="row">
<div class="col-sm-10 col-md-8">
<span class="h1">志愿服务 回馈社会</span>
<p class="lead">
十年树木，百年树人。Coding Minds为同学提供科技相关的志愿者服务机会，培养领导力的同时启发同学服务社会，回馈社会。
</p>
</div>
</div>
<!--end of row-->
</div>
<!--end of container-->
</section>
<section class="text-center">
<div class="container">
<div class="row">
<div class="col-sm-4">
<div class="feature feature-6">
<i class="icon icon--lg icon-Laughing color--primary"></i>
<h4>服务意识</h4>
<p>
服务意识和反馈思想是一个科技创业者所需要具备的基本素质
</p>
</div>
<!--end feature-->
</div>
<div class="col-sm-4">
<div class="feature feature-6">
<i class="icon icon--lg icon-Medical-Sign color--primary"></i>
<h4>拓宽视野</h4>
<p>
学院的志愿活动可以接触到很多有知名度的专家学者 行业精英
</p>
</div>
<!--end feature-->
</div>
<div class="col-sm-4">
<div class="feature feature-6">
<i class="icon icon--lg icon-Finger-Print color--primary"></i>
<h4>积累经验</h4>
<p>
志愿服务为大学申请积累了雄厚的资本
</p>
</div>
<!--end feature-->
</div>
</div>
<!--end of row-->
</div>
<!--end of container-->
</section>
<section class="text-center bg--secondary">
<div class="container">
<div class="row">
<div class="col-sm-10 col-md-8">
<h1>为什么选择Coding Minds</h1>
</div>
</div>
<!--end of row-->
</div>
<!--end of container-->
</section>
<section class="space--sm text-center ">
<div class="container">
<div class="row">
<div class="col-sm-10 col-md-8">
<div class="text-center">
<i class="icon icon-Statistic color--primary"></i>
<h1 class="text-center" style = "font-size: 40px">编程课程体系<br></h2>
<hr>
<p class="lead">
Coding Minds编程课程体系由美国大学计算机教授团队从美国大学申请的角度设计，进阶性的学习编程，培养兴趣和实践能力，让孩子从小打下坚实的编程基础
</p>
<img alt="Image" class="border--round box-shadow" src="img/pathway/plevel4.png">
<p class="lead">
所有课程以项目为阶段性目标，增强学生的科技创新背景和信心
</p>
<img alt="Image" class="border--round box-shadow" src="img/pathway/biggoals2.png">
</div>
</div>
</div>
</div>
</section>
<section class="text-center bg--secondary">
<div class="container">
<div class="row">
<div class="col-sm-10 col-md-8">
<span class="h1">课程与服务</span>
</div>
</div>
<!--end of row-->
</div>
<!--end of container-->
</section>
<section>
<div class="container">
<div class="row">
<div class="col-sm-12">
<div class="masonry masonry-blog-magazine">
<div class="row">
<div class="masonry__container masonry--active" style="position: relative; height: 1104px;">
<div class="masonry__item col-sm-6" style="position: absolute; left: 0px; top: 0px;"></div>
<!--div class="masonry__item col-sm-12 col-xs-12 h filter-marketing" data-masonry-filter="Marketing" style="position: absolute; left: 0px; top: 0px;">
<a class="block" href="#">
<article class="imagebg border--round" data-scrim-bottom="8">
<span class="label">New</span>
<div class="background-image-holder" style="background: url("img/blog-2.jpg"); opacity: 1;">
<img alt="background" src="img/blog-2.jpg">
</div>
<div class="article__title">
<span>May 15th 2016</span>
<h4>A day in the life of a professional fitness blogger</h4>
</div>
</article>
</a>
</div!-->
<!--end item-->
<div class="masonry__item col-sm-6 col-xs-12 filter-marketing" data-masonry-filter="Marketing" style="position: absolute; left: 0px; top: 368px;">
<a class="block" href="online-classc.html">
<article class="imagebg border--round" data-scrim-bottom="8">
<div class="background-image-holder" style="background: url("img/service-1.jpg"); opacity: 1;">
<img alt="background" src="img/service-1.jpg">
</div>
<div class="article__title">
<h1>Online小班教学</h1>
<h4>线上小班教学每班不超过3名同学，精英教师保证教学质量</h4>
</div>
</article>
</a>
</div>
<!--end item-->
<div class="masonry__item col-sm-6 col-xs-12 filter-design" data-masonry-filter="Design" style="position: absolute; left: 0px; top: 736px;">
<a class="block" href="online-1v1c.html">
<article class="imagebg border--round" data-scrim-bottom="8">
<div class="background-image-holder" style="background: url("img/service-2.jpg"); opacity: 1;">
<img alt="background" src="img/service-2.jpg">
</div>
<div class="article__title">
<h1>Online1对1教学</h1>
<h4>一对一教学时间灵活，老师单独辅导学习</h4>
</div>
</article>
</a>
</div>
<div class="masonry__item col-sm-6 col-xs-12 filter-marketing" data-masonry-filter="Marketing" style="position: absolute; left: 0px; top: 368px;">
<a class="block" href="enrichmentc.html">
<article class="imagebg border--round" data-scrim-bottom="8">
<div class="background-image-holder" style="background: url("img/service-3.jpg"); opacity: 1;">
<img alt="background" src="img/service-3.jpg">
</div>
<div class="article__title">
<h1>名校背景提升</h1>
<h4>科研创业项目导向的背景提升课程，
已帮助许多同学步入名校</h4>
</div>
</article>
</a>
</div>
<div class="masonry__item col-sm-6 col-xs-12 filter-marketing" data-masonry-filter="Marketing" style="position: absolute; left: 0px; top: 368px;">
<a class="block" href="afterschool.html">
<article class="imagebg border--round" data-scrim-bottom="8">
<div class="background-image-holder" style="background: url("img/service-4.jpg"); opacity: 1;">
<img alt="background" src="img/service-4.jpg">
</div>
<div class="article__title">
<h1>课后班合作</h1>
<h4>与多所中小学合作开办课后班课程 将编程课堂带入校园</h4>
</div>
</article>
</a>
</div>
<!--end item-->
</div>
<!--end masonry container-->
</div>
<!--end of row-->
</div>
<!--end masonry-->
</div>
</div>
<!--end of row-->
</div>
<!--end of container-->
</section>
<section class="text-center bg--secondary">
<div class="container">
<div class="row">
<div class="col-sm-10 col-md-8">
<span class="h1">优秀学生案例</span>
</div>
</div>
<!--end of row-->
</div>
<!--end of container-->
</section>
<!--section class="text-center">
<div class="container">
<div class="row">
<div class="col-sm-4">
<div class="feature feature-8">
<img alt="Image" src="img/avatar-round-1.png">
<h5>Vera </h5>
<span>Founder & CEO</span>
</div>
</div>
<div class="col-sm-4">
<div class="feature feature-8">
<img alt="Image" src="img/avatar-round-3.png">
<h5>Zach</h5>
<span>Co-Founder & CTO</span>
</div>
</div>
<div class="col-sm-4">
<div class="feature feature-8">
<img alt="Image" src="img/avatar-round-2.png">
<h5>Bernice </h5>
<span>Chief of Operations</span>
</div>
</div>
<div class="col-sm-4">
<div class="feature feature-8">
<img alt="Image" src="img/avatar-round-4.png">
<h5>Cameron</h5>
<span>Lead Designer</span>
</div>
</div>
<div class="col-sm-4">
<div class="feature feature-8">
<img alt="Image" src="img/avatar-round-5.png">
<h5>Josie</h5>
<span>Head of Development</span>
</div>
</div>
<div class="col-sm-4">
<div class="feature feature-8">
<img alt="Image" src="img/avatar-round-6.png">
<h5>Bryce</h5>
<span>Marketing Director</span>
</div>
</div>
</div>
</div>
</section-->
<section class="text-center">
<div class="container">
<div class="row">
<div class="slider" data-arrows="true" data-paging="true" data-children="4">
<ul class="slides flickity-enabled is-draggable" tabindex="0">
<div class="flickity-viewport is-pointer-down" style="height: 30.453px;"><div class="flickity-slider" style="left: 0px; transform: translateX(-300%);"><li class="col-md-6 col-sm-12 col-xs-12 slide" style="position: absolute; left: 0%;">
<img alt="Image" src="img/student-card/student1.png">
</li><li class="col-md-6 col-sm-12 col-xs-12 slide" style="position: absolute; left: 100%;">
<img alt="Image" src="img/student-card/student2.png">
</li><li class="col-md-6 col-sm-12 col-xs-12 slide" style="position: absolute; left: 200%;">
<img alt="Image" src="img/student-card/student3.png">
</li><li class="col-md-6 col-sm-12 col-xs-12 slide is-selected" style="position: absolute; left: 300%;">
<img alt="Image" src="img/student-card/student4.png">
</li><li class="col-md-6 col-sm-12 col-xs-12 slide is-selected" style="position: absolute; left: 400%;">
<img alt="Image" src="img/student-card/student5.png">
</li><li class="col-md-6 col-sm-12 col-xs-12 slide is-selected" style="position: absolute; left: 500%;">
<img alt="Image" src="img/student-card/student6.png">
</li>
</div></div><button class="flickity-prev-next-button previous" type="button" aria-label="previous"><svg viewBox="0 0 100 100"><path d="M 10,50 L 60,100 L 70,90 L 30,50 L 70,10 L 60,0 Z" class="arrow"></path></svg></button><button class="flickity-prev-next-button next" type="button" aria-label="next"><svg viewBox="0 0 100 100"><path d="M 10,50 L 60,100 L 70,90 L 30,50 L 70,10 L 60,0 Z" class="arrow" transform="translate(100, 100) rotate(180) "></path></svg></button><ol class="flickity-page-dots"><li class="dot"></li><li class="dot"></li><li class="dot"></li><li class="dot"></li></ol></ul>
</div>
</div>
<!--end of row-->
</div>
<!--end of container-->
</section>
<section class="text-center imagebg" data-overlay="4">
<div class="background-image-holder" style="background: url("img/my/coding-thinking.jpg"); opacity: 1;">
<img alt="background" src="img/my/coding-thinking.jpg">
</div>
<div class="container">
<div class="row">
<div class="col-sm-8 col-sm-offset-2 col-md-6 col-md-offset-3">
<div class="cta">
<h2 class="underline-small">联系试课</h2>
<p class="lead">
试课内容涵盖图形编程、代码编程、简介代码编程、以及应用主题编程等丰富内容，由资深教师执教，确保同学能体会到编程的奥妙，带领同学走进编程世界的大门
</p>
<br>
<br>
</div>
</div>
</div>
<!--end of row-->
</div>
<!--end of container-->
</section>
<section class="bg--secondary">
<div class="container">
<div class="row col-3">
<div class="left-sec">
<h2 class="shike-num type--bold">1</h2>
<h3 class="shike-txt">预约试课</h3>
<p class="shike-subtxt">
点击右侧“免费试课”
</p>
</div>
<div>
<h2 class="shike-num type--bold">2</h2>
<h3 class="shike-txt">定制排课</h3>
<p class="shike-subtxt">
与CodingMinds老师进行个性化的课程设计
</p>
</div>
<div>
<h2 class="shike-num type--bold">3</h2>
<h3 class="shike-txt">学院入学</h3>
<p class="shike-subtxt">
安排同学入学
并根据反馈及时调整课程内容
</p>
</div>
</div>
</div>
</div>
</section>
<!--section class="bg text-center">
<div class="container">
<div class="row">
<div class="col-sm-8 col-md-6">
<div class="cta">
<a class="btn btn--sm btn--primary type--uppercase" href="https://jinshuju.net/f/gM64Iv"> <span class="btn__text">
免费试听注册
</span> </a>
</div>
</div>
</div>
</div>
</section-->
<!--section id= "mainidea" class="text-center">
<div class="container">
<div class="row">
<div class="col-sm-10 col-md-8">
<h2>学期计划</h2>
<p class="lead">
编程思维2020年夏季采用线上教学。请同学们先通过网站或联系工作人员报名试课。老师会根据课程体系和同学情况为同学推荐合适的课程。试课过后老师会与同学沟通反馈并安排同学入学。<span style = "color:#6495ED">学期中每周都有新班开课，供同学们选择。暑假期间也可报名参加一周多次课的夏令营项目。</span>
</p>
</div>
</div>
</div>
</section-->
<!--section class="bg--secondary">
<div class="container">
<div class="row">
<div class="col-sm-4">
<div class="feature feature-4 boxed boxed--lg boxed--border box-shadow">
<h4>小班教学</h4>
<hr>
<p>
编程思维网课采用线上小班教学，辅以各样教学科技保证课堂效果。同时保证与家长的实时沟通，确保同学的学习状态，使网课效果等同于教室。
</p>
<a class="btn btn--primary-2" href="https://mp.weixin.qq.com/s?__biz=MzUyODA3NDA5OA==&mid=2247483991&idx=1&sn=03deeb848ff7eab47921a89b83f4f86a&chksm=fa74964acd031f5c2e2cef85801e0eaee577140fbf4af9e091eeafcba6b613857118b32aa704&token=1515880380&lang=zh_CN#rd">
<span class="btn__text">
了解更多
</span>
</a>
</div>
</div>
<div class="col-sm-4">
<div class="feature feature-4 boxed boxed--lg boxed--border box-shadow">
<h4>动手实践</h4>
<hr>
<p>
计算机编程是一门非常实际的学科，学生如果只听讲是远远不够的。我们的课程强调动手写程序，做项目，让同学每一节课都可以做出一个具体的应用，培养他们的兴趣，提高他们的信心。
</p>
<a class="btn btn--primary-2" href="conferencec.html">
<span class="btn__text">
了解更多
</span>
</a>