-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
172 lines (163 loc) · 7.93 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
<!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="bootstrap-4.5.2-dist/css/bootstrap.css">
<link rel="stylesheet" href="aos/dist/aos.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="./style/all.min.css">
<link rel="stylesheet" href="./style/style.css">
<title>Biruang Brand</title>
</head>
<body>
<!-- Header start -->
<header>
<div class="menu_title">
<nav>
<div class="nav_top">
<a href="#" class="logo">BIRUANG</a>
<div class="nav_adres">
<div class="contact">
<p class="number"><i class="fas fa-phone-alt"></i>+371 282 20 760</p>
<p class="email"><i class="far fa-envelope"></i>eony321v@gmail.com</p>
</div>
<div class="price"><i class="fas fa-shopping-cart"></i>$ 99.54</div>
</div>
</div>
<div class="nav_bottom">
<ul>
<li><a href="#" class="active">Home</a></li>
<li><a href="#">MEN</a></li>
<li><a href="#">WOMEN</a></li>
<li><a href="#">KIDS</a></li>
<li><a href="#">SALE</a></li>
<li><a href="#">ABOUT US</a></li>
<li><a href="#">SUPPORT</a></li>
<li><a href="#"><i class="fas fa-search"></i>Search</a></li>
</ul>
</div>
</nav>
</div>
<div class="head">
<div class="container">
<h1>RIGHT IS PINK. <br>
LEFT IS BLUE</h1>
<p>Inspired by Brasil’s bold colors and matching up to football’s on-pitch<br>
playmakers, these kicks are ready to stand out.</p>
<button class="btn">SHOP BRASIL</button>
</div>
</div>
</header>
<!-- Header end -->
<!-- MAIN start -->
<main>
<div class="about">
<div class="main_top">
<div class="main_top_box" data-aos="flip-left" data-aos-duration="1200">
<img src="images/main top.png" alt="png">
<div class="box">
<h2><a href="#">FOOTBALL SHOES</a></h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing,
vivamus congue nulla leo, quis imperdiet magna.</p>
</div>
</div>
<div class="main_top_box" data-aos="flip-up" data-aos-duration="1200">
<img src="images/main top.png" class="img" alt="png">
<div class="box">
<h2><a href="#">MODERN CLOTHES</a></h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing,
vivamus congue nulla leo, quis imperdiet magna.</p>
</div>
</div>
<div class="main_top_box" data-aos="flip-right" data-aos-duration="1200">
<img src="images/main top.png" alt="png">
<div class="box">
<h2><a href="#">BAGS & ACCESSORIES</a></h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing,
vivamus congue nulla leo, quis imperdiet magna.</p>
</div>
</div>
</div>
<div class="main_bottom">
<h2>POPULAR PRODUCTS</h2>
<div class="main_bottom_box">
<div class="bottom_box" data-aos="zoom-out" data-aos-duration="1200">
<img src="images/main bottom.png" alt="png">
<h3>Nike Tailwind Loose</h3>
<h5>Running Tank Top</h5>
<p>The Nike Tailwind Loose Women's Running Tank
Top is made with sweat-wicking fabric to help you
stay dry and comfortable on your run.</p>
<img src="images/line.png" alt="" class="line" >
<div class="bottom_price">
<p>$ 36.99</p>
<ul>
<li><i class="far fa-heart"></i></li>
<li><i class="fas fa-plus-circle"></i></li>
</ul>
</div>
</div>
<div class="bottom_box" data-aos="zoom-out" data-aos-duration="1200">
<img src="images/main bottom.png" alt="png">
<h3>Nike g87</h3>
<h5>Training Tank Top</h5>
<p>The Nike G87 Women's Training Tank Top features
soft, sweat-wicking fabric and a regular fit for total
comfort during any workout.</p>
<img src="images/line.png" alt="" class="line" >
<div class="bottom_price">
<p>$ 49.99</p>
<ul>
<li><i class="far fa-heart"></i></li>
<li><i class="fas fa-plus-circle"></i></li>
</ul>
</div>
</div>
<div class="bottom_box" data-aos="zoom-out" data-aos-duration="1200">
<img src="images/main bottom.png" alt="png">
<h3>Nike I-Beam Swoosh</h3>
<h5>Sports Top</h5>
<p>The Nike I-Beam Swoosh Women's Sports Top
features a built-in bra and mesh back panel for
lightweight support and targeted breathability.</p>
<img src="images/line.png" alt="" class="line" >
<div class="bottom_price">
<p>$ 70.00</p>
<ul>
<li><i class="far fa-heart"></i></li>
<li><i class="fas fa-plus-circle"></i></li>
</ul>
</div>
</div>
<div class="bottom_box" data-aos="zoom-out" data-aos-duration="1200">
<img src="images/main bottom.png" alt="png">
<h3>Nike lux</h3>
<h5>Running Top</h5>
<p>The Nike Lux Women's Running Top is made with
lightweight Dri-FIT fabric and features a perforated
back panel for comfort and enhanced breathability.</p>
<img src="images/line.png" alt="" class="line" >
<div class="bottom_price">
<p>$ 28.49</p>
<ul>
<li><i class="far fa-heart"></i></li>
<li><i class="fas fa-plus-circle"></i></li>
</ul>
</div>
</div>
</div>
</div>
</main>
<!-- Main end -->
<script src="bootstrap-4.5.2-dist/js/bootstrap.min.js"></script>
<script src="aos/dist/aos.js"></script>
<script>
AOS.init({
easing: 'ease-in-out-sine'});
</script>
</body>
</html>