-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
212 lines (197 loc) · 11.7 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
<!DOCTYPE >
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="said ait driss">
<meta name="keywords" content="html ,css, flexible app, responsive desing,responsive web application">
<meta name="description" content="the flexible application creadted by said ait driss for depping his knowledgy about desing with css">
<meta http-equiv="refresh" content="5;url=/">
<meta name="viewport" content="width=width-device initial-scale=1">
<title>flexible application</title>
<link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>
<div class="parent">
<header>
<div class="logo"><h1>Sd Shop Online</h1></div>
<div class="getInto">
<button>Sign up <span>→</span></button>
<button>Sign in</button>
</div>
</header>
<menu id="#up">
<div class="links">
<a href="#">HOME</a>
<a href="#">NEWS</a>
<a href="#">SHOP</a>
<a href="#">ABOUT</a>
<a href="#">CONTACT</a>
</div>
<div class="search">
<input type="text" placeholder="looking for ?" >
</div>
</menu>
<main>
<div class="left">
<img src="icons/watch_blue.svg" alt="">
</div>
<div class="right">
<form action="">
<div class="div_inside_form">
<label for="Email">Adress email :</label>
<input type="email" name="" id="" placeholder="ADRESS EMAIL" required>
<label for="passwrd">Password :</label>
<input type="password" name="" id="" placeholder="PASSWORD" required>
<p>Make sure it's at least 15 characters OR at least 8 characters including a number and a lowercase letter. <a href="#">Learn more.</a></p>
<input type="submit" name="" id="" value="Sign un">
<p>By clicking “Sign up ”, you agree to our <a href="#"> Terms of Service </a> and <a href="#"> Privacy Statement.</a> We’ll occasionally send you account related emails.</p>
</div>
</form>
</div>
</main>
<div class="Infos">
<img src="icons/coffee_break.svg" alt="" class="chilling">
<div class="parent_info">
<div class="left_info">
<h2>Get started with SD Enterprise</h2>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Expedita, adipisci facilis dicta atque labore ex unde eligendi explicabo distinctio dignissimos ducimus magni </p>
<button>Get started <span>→</span></button>
</div>
<div class="right_info">
<img src="icons/info_right.svg" alt="">
</div>
</div>
</div>
<div class="category">
<h3>A better way to work together</h3>
<p>SD brings teams together to work through problems, move ideas forward</p>
<div class="parent_category" id="child">
<div class="child_category_1" id="child">
<img src="icons/child1.svg" alt="">
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestiae reprehenderit nisi esse veniam cupiditate ipsam, velit consequatur sint quo distinctio, totam id suscipit ipsa facilis laudantium pariatur? Eaque, magnam temporibus.</p>
</div>
<div class="child_category_2" id="child">
<img src="icons/child2.svg" alt="">
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Velit reiciendis animi corrupti eius eveniet, illum consequatur veniam repellendus, neque molestiae ullam mollitia, quos error molestias et omnis ut nisi beatae.</p>
</div>
<div class="child_category_3" id="child">
<img src="icons/child3.svg" alt="">
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis quod laboriosam eveniet mollitia sequi qui aliquid quae blanditiis, illum ullam sapiente ipsam vero suscipit in ut necessitatibus iure dolorum impedit.</p>
</div>
<div class="child_category_4" id="child">
<img src="icons/child5.svg" alt="">
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Nihil magnam qui est aspernatur, nisi minus quia dignissimos deserunt possimus debitis voluptas quibusdam aperiam nam ex at explicabo error incidunt architecto.</p>
</div>
</div>
</div>
<div class="to_upward">
<a href="#up">
<svg style="width:60px;height:60px" viewBox="0 0 24 24">
<path fill="#003554e0" d="M15,20H9V12H4.16L12,4.16L19.84,12H15V20Z" />
</svg>
</a>
</div>
<footer >
<div class="footer_div">
<div class="social_icons">
<?xml version="1.0" encoding="utf-8"?>
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="50px" height="50px" viewBox="0 0 260 260" enable-background="new 0 0 260 260" xml:space="preserve">
<path d="M130,2C59.308,2,2,59.308,2,130s57.308,128,128,128s128-57.308,128-128S200.692,2,130,2z M179,71h-24
c-6.627,0-12,5.373-12,12v24h36l-4,32h-32v80h-32v-80H82v-32h29V82.352c0-23.519,19.798-42.188,43.277-40.806L179,43V71z"/>
</svg>
<?xml version="1.0" encoding="iso-8859-1"?>
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 310 310" style="enable-background:new 0 0 310 310;" xml:space="preserve">
<g id="XMLID_822_">
<path id="XMLID_823_" d="M297.917,64.645c-11.19-13.302-31.85-18.728-71.306-18.728H83.386c-40.359,0-61.369,5.776-72.517,19.938
C0,79.663,0,100.008,0,128.166v53.669c0,54.551,12.896,82.248,83.386,82.248h143.226c34.216,0,53.176-4.788,65.442-16.527
C304.633,235.518,310,215.863,310,181.835v-53.669C310,98.471,309.159,78.006,297.917,64.645z M199.021,162.41l-65.038,33.991
c-1.454,0.76-3.044,1.137-4.632,1.137c-1.798,0-3.592-0.484-5.181-1.446c-2.992-1.813-4.819-5.056-4.819-8.554v-67.764
c0-3.492,1.822-6.732,4.808-8.546c2.987-1.814,6.702-1.938,9.801-0.328l65.038,33.772c3.309,1.718,5.387,5.134,5.392,8.861
C204.394,157.263,202.325,160.684,199.021,162.41z"/>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
</svg>
<svg width="50px" height="50px" viewBox="0 0 2476 2476" xmlns="http://www.w3.org/2000/svg"><path d="M825.4 1238c0-227.9 184.7-412.7 412.6-412.7 227.9 0 412.7 184.8 412.7 412.7 0 227.9-184.8 412.7-412.7 412.7-227.9 0-412.6-184.8-412.6-412.7m-223.1 0c0 351.1 284.6 635.7 635.7 635.7s635.7-284.6 635.7-635.7-284.6-635.7-635.7-635.7S602.3 886.9 602.3 1238m1148-660.9c0 82 66.5 148.6 148.6 148.6 82 0 148.6-66.6 148.6-148.6s-66.5-148.5-148.6-148.5-148.6 66.5-148.6 148.5M737.8 2245.7c-120.7-5.5-186.3-25.6-229.9-42.6-57.8-22.5-99-49.3-142.4-92.6-43.3-43.3-70.2-84.5-92.6-142.3-17-43.6-37.1-109.2-42.6-229.9-6-130.5-7.2-169.7-7.2-500.3s1.3-369.7 7.2-500.3c5.5-120.7 25.7-186.2 42.6-229.9 22.5-57.8 49.3-99 92.6-142.4 43.3-43.3 84.5-70.2 142.4-92.6 43.6-17 109.2-37.1 229.9-42.6 130.5-6 169.7-7.2 500.2-7.2 330.6 0 369.7 1.3 500.3 7.2 120.7 5.5 186.2 25.7 229.9 42.6 57.8 22.4 99 49.3 142.4 92.6 43.3 43.3 70.1 84.6 92.6 142.4 17 43.6 37.1 109.2 42.6 229.9 6 130.6 7.2 169.7 7.2 500.3 0 330.5-1.2 369.7-7.2 500.3-5.5 120.7-25.7 186.3-42.6 229.9-22.5 57.8-49.3 99-92.6 142.3-43.3 43.3-84.6 70.1-142.4 92.6-43.6 17-109.2 37.1-229.9 42.6-130.5 6-169.7 7.2-500.3 7.2-330.5 0-369.7-1.2-500.2-7.2M727.6 7.5c-131.8 6-221.8 26.9-300.5 57.5-81.4 31.6-150.4 74-219.3 142.8C139 276.6 96.6 345.6 65 427.1 34.4 505.8 13.5 595.8 7.5 727.6 1.4 859.6 0 901.8 0 1238s1.4 378.4 7.5 510.4c6 131.8 26.9 221.8 57.5 300.5 31.6 81.4 73.9 150.5 142.8 219.3 68.8 68.8 137.8 111.1 219.3 142.8 78.8 30.6 168.7 51.5 300.5 57.5 132.1 6 174.2 7.5 510.4 7.5 336.3 0 378.4-1.4 510.4-7.5 131.8-6 221.8-26.9 300.5-57.5 81.4-31.7 150.4-74 219.3-142.8 68.8-68.8 111.1-137.9 142.8-219.3 30.6-78.7 51.6-168.7 57.5-300.5 6-132.1 7.4-174.2 7.4-510.4s-1.4-378.4-7.4-510.4c-6-131.8-26.9-221.8-57.5-300.5-31.7-81.4-74-150.4-142.8-219.3C2199.4 139 2130.3 96.6 2049 65c-78.8-30.6-168.8-51.6-300.5-57.5-132-6-174.2-7.5-510.4-7.5-336.3 0-378.4 1.4-510.5 7.5"/></svg>
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" >
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="50px" height="50px" viewBox="0 0 33.88 33.88" style="enable-background:new 0 0 33.88 33.88;" xml:space="preserve"
>
<g>
<path d="M30.414,10.031c0.014,0.297,0.021,0.595,0.021,0.897c0,9.187-6.992,19.779-19.779,19.779c-3.928,0-7.58-1.149-10.657-3.123
c0.546,0.063,1.099,0.095,1.658,0.095c3.26,0,6.254-1.107,8.632-2.974c-3.039-0.058-5.607-2.065-6.491-4.828
c0.424,0.082,0.858,0.125,1.308,0.125c0.635,0,1.248-0.084,1.83-0.244c-3.177-0.639-5.576-3.448-5.576-6.815
c0-0.029,0-0.058,0-0.087c0.939,0.521,2.01,0.833,3.15,0.869C2.646,12.48,1.419,10.35,1.419,7.938c0-1.274,0.343-2.467,0.94-3.495
c3.427,4.206,8.552,6.973,14.327,7.263c-0.117-0.509-0.18-1.038-0.18-1.584c0-3.838,3.112-6.949,6.953-6.949
c1.998,0,3.805,0.844,5.07,2.192c1.582-0.311,3.072-0.89,4.416-1.686c-0.521,1.624-1.621,2.986-3.057,3.844
c1.406-0.166,2.746-0.54,3.991-1.092C32.949,7.826,31.771,9.05,30.414,10.031z"/>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
</svg>
</div>
<p>Copyright © 2020 all right reserved</p>
</div>
</footer>
</div>
</body>
</html>