-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
190 lines (187 loc) · 6.26 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
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, shrink-to-fit=no"
/>
<!-- Bootstrap CSS -->
<link rel="shortcut icon" href="image/logo-login.ico" />
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css"
integrity="sha512-1ycn6IcaQQ40/MKBW2W4Rhis/DbILU74C1vSrLJxCq57o941Ym01SwNsOMqvEBFlcgUa6xLiPY/NS5R+E6ztJQ=="
crossorigin="anonymous"
referrerpolicy="no-referrer"
/>
<link rel="stylesheet" href="css/bootstrap.min.css" />
<link rel="stylesheet" href="css/style.min.css" />
<title>BrainLab</title>
</head>
<body>
<!-- navbar -->
<nav class="navbar navbar-expand-lg navbar-light">
<div class="logo ml-5">
<img src="image/logo.png" alt="logo" />
<a class="navbar-brand logo" href="index.html">Brain<span>Lab</span></a>
</div>
<button
class="navbar-toggler"
type="button"
data-toggle="collapse"
data-target="#navbarNav"
aria-controls="navbarNav"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<div class="login ml-auto mr-5">
<button type="button" class="btn login">Login</button>
</div>
</div>
</nav>
<!-- end navbar -->
<div class="jumbotron jumbotron-fluid">
<div class="box-login hide">
<form action="">
<div class="judul">
<img src="image/logo-login.png" alt="" />
<h1>BrainLab</h1>
</div>
<div class="input">
<label for="username">username</label>
<input type="text" name="username" id="username" />
</div>
<div class="input">
<label for="password">password</label>
<input type="text" name="password" id="password" />
</div>
<div class="forget">
<a href="">Lupa Passowrd?</a>
</div>
<div class="button">
<button>Login</button>
</div>
</form>
</div>
<div class="container">
<div class="judul">
<h1 class="display-4">Belajar Online ? Ya BRAINLAB</h1>
<p class="lead">Bikin Percaya Diri Meraih prestasi</p>
</div>
</div>
<img class="gambar" src="image/Frame 5.png" alt="ilustration" />
</div>
<!-- end jumbotron -->
<!-- section top -->
<section class="row p-3 m-2 top">
<div class="container">
<div class="judul row justify-content-center">
<h1>YUK LIHAT APA ITU BRAINLAB</h1>
</div>
<div class="menu mt-5 row justify-content-center">
<div class="col-md-11 row box tengah justify-content-around">
<div
class="col-md-3 item row items justify-content-center align-items-center"
>
<a href="#satu">Kenapa Brainlab?</a>
</div>
<div
class="col-md-3 item items row justify-content-center align-items-center"
>
<a href="#dua"> Tujuan BrainLab</a>
</div>
<div
class="col-md-3 item items row justify-content-center align-items-center"
>
<a href="#tiga">Cara Belajar</a>
</div>
</div>
</div>
</div>
</section>
<!-- end section -->
<!-- section middle -->
<section class="tengah">
<div class="top">
<div id="satu" class="one">
<img src="image/1.png" alt="" />
<div class="one-kanan">
<div class="box">
<h2>Kenapa Menggunakan Brain <span>Lab</span></h2>
<br>
<p>
Kita menyediakan pembelajaran yang mudah di pahami oleh peserta
didik.
</p>
</div>
</div>
</div>
<div class="two" id="dua">
<div class="two-kiri">
<div class="box">
<h2>Kita Membantu<span>Pelajar Sampai Sukses</span> Berkarir</h2>
<p style="font-size: 24px;">
Kita menyediakan pembelajaran yang mudah di pahami oleh peserta
didik.
</p>
</div>
</div>
<img src="image/2.png" alt="" />
</div>
</div>
<div class="bottom" id="tiga">
<div class="three">
<div class="image">
<img src="image/back.png" class="img-1" alt="bakground hijau" />
<img src="image/math.png" class="img-2" alt="math" />
<img src="image/list.png" class="img-3" alt="list" />
</div>
<div class="three-kanan">
<div class="box">
<h2><span>Bikin Pintar</span> Tanpa Susah Susah</h2>
<p>
BrainLab ngajak mencari tau sampai ke akar. Gak ada tuh jawaban
"ya dari sananya begitu". Bareng BrainLab, selami rangkaian cerita
yang runtut dan masuk akal.
</p>
</div>
</div>
</div>
</div>
</section>
<!-- end Section Middle -->
<!-- footer -->
<footer>
<div class="container" style="text-align: center;">
<div class="logo">
<img src="image/logo.png" alt="logo" />
<h2>Brain<span>Lab</span></h2>
</div>
<div class="isi">Belajar lebih menyenangkan bersama BrainLab
<p>© Copyright 2021 | built by BrainLabTeam </p>
</div>
<div class="sosmed">
<a href="https://instagram.com/"
><i class="fab fa-instagram fa-2x"></i
></a>
<a href="https://facebook.com/"
><i class="fab fa-facebook fa-2x"></i
></a>
<a href="https://twitter.com/"
><i class="fab fa-twitter fa-2x"></i
></a>
</div>
</div>
</footer>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>