/
index.html
179 lines (176 loc) · 9.17 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
<!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="/dz/css/style.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300&family=Rubik:wght@300&display=swap"
rel="stylesheet">
<title>Maket</title>
</head>
<body>
<main>
<div class="top" id="head">
<div class="top__item" id="dog"> <span>1</span></div>
<div class="top__item" id="Ali">
<div class="flex">
<div class="flex__item" id="burger">
<p>☰</p>
</div>
<div class="flex__item">
<p>Ali Sayed's</p>
</div>
<div class="flex__item letter">
<p><span> Web Designing</span></p>
</div>
<div class="flex__item" id="proj">
<p>Project</p>
</div>
<div class="flex__item ">
<p class="lorem">Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolore saepe
distinctio quas quis
dolorum
tenetur in, quae fugit nesciunt ex facere quos libero molestias illum porro, iste voluptate
temporibus
culpa?</p>
</div>
<div class="flex__item ">
<p class="lorem">Lorem ipsum dolor sit amet consectetur adipisicing elit. Officia sint magni
repellat iusto
distinctio
facere laboriosam modi fugit reprehenderit aspernatur, dolorum minima explicabo, reiciendis
possimus
dolorem maiores blanditiis. Rerum, odio.</p>
</div>
</div>
</div>
</div>
<div class="mid" id="mid">
<div class="mid__item" id="leftmid">
<div class="flex">
<div class="flex__item ">
<div class="letter">Drawing <span>Scketch</span></p>
</div>
</div>
<div class="flex__item">
<p class="lorem">Lorem ipsum dolor sit amet consectetur adipisicing elit. Fugit minima,
consectetur quod voluptate reiciendis sapiente laboriosam quia odio fuga eos a quae dolorum
pariatur natus inventore laudantium quam aut nulla corrupti officia ipsa perspiciatis?
Nesciunt aliquam fuga, alias repellendus odit cumque atque est, iste hic maxime quam eveniet
eos vero?</p>
</div>
<div class="flex__item ">
<div class="letter">
<p>Making <span>Design</span></p>
</div>
</div>
<div class="flex__item">
<p class="lorem">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Totam recusandae quis
iste ipsum minima, laudantium commodi laboriosam cumque animi consequatur dicta, quos alias
aspernatur ea molestiae obcaecati ratione harum adipisci facere reprehenderit voluptatem
placeat facilis molestias ipsam. Labore accusantium mollitia ea, iste, doloremque
consectetur quaerat totam facilis sapiente molestiae aliquam!</p>
</div>
<div class="flex__item ">
<div class="letter">
<p>Developing <span>Product</span></p>
</div>
</div>
<div class="flex__item ">
<p class="lorem">Lorem ipsum dolor sit amet consectetur adipisicing elit. Doloribus dolores in
officia magnam temporibus voluptatum harum mollitia accusantium neque dolore quibusdam
placeat provident tempora, reiciendis accusamus repudiandae sed inventore? Commodi incidunt
numquam consectetur aliquid dolores voluptas, fuga, quae aut reprehenderit adipisci enim,
temporibus quos natus. Illum quaerat impedit mollitia vero.</p>
</div>
</div>
</div>
<div class="mid__item" id="rtopmid">
<div class="flex">
<div class="flex__item ">
<div class="flex__item ">
<div class="letter">
<p>Best <span>Strarting</span></p>
</div>
</div>
<div class="flex__item ">
<p class="lorem">Lorem ipsum dolor sit amet consectetur adipisicing elit. Doloribus dolores
in
officia magnam temporibus voluptatum harum mollitia accusantium neque dolore quibusdam
placeat provident tempora, reiciendis accusamus repudiandae sed inventore? Commodi
incidunt
numquam consectetur aliquid dolores voluptas, fuga, quae aut reprehenderit adipisci
enim,
temporibus quos natus. Illum quaerat impedit mollitia vero.</p>
</div>
<div class="flex__item "><button>View Our History</button></div>
</div>
</div>
</div>
<div class="mid__item" id="rbotmid">
<div class="flex">
<div class="flex__item ">
<div class="flex__item ">
<div class="letter">
<p>Verified <span>Dummy</span></p>
</div>
</div>
<div class="flex__item ">
<p class="lorem">Lorem ipsum dolor sit amet consectetur adipisicing elit. Doloribus dolores
in
officia magnam temporibus voluptatum harum mollitia accusantium neque dolore quibusdam
placeat provident tempora, reiciendis accusamus repudiandae sed inventore? Commodi
incidunt
numquam consectetur aliquid dolores voluptas, fuga, quae aut reprehenderit adipisci
enim,
temporibus quos natus. Illum quaerat impedit mollitia vero.</p>
</div>
<div class="flex__item"><button id="wbutton">Go To The Page</button></div>
</div>
</div>
</div>
</div>
<div class="bottom" id="dno">
<div class="bottom__item" id="lbot">
<div class="blflex">
<div class="blflex__item">
<p>This Webpage is<br> <span> Designed By</span></p>
</div>
<div class="blflex__item">
<div class="logo"></div>
</div>
<div class="blflex__item">
<p><span> Sergei Gor.<span></p>
</div>
<div class="blflex__item">
<p>Graphic Designer </p>
</div>
</div>
</div>
<div class="bottom__item" id="rbot">
<div class="brflex">
<div class="brflex__item">
<p>Say <span>'Hello'</span></p>
</div>
<div class="brflex__item"><input type="text" placeholder="Your Name">
<input type="email" placeholder="Your Email"></div>
<div class="brflex__item"> <textarea placeholder="Your Message Here ..."></textarea></div>
<div class="brflex__item">
<p>Stay Connected With Us...</p>
</div>
<div class="brflex__item"><a target="_blank" href="https://www.youtube.com/watch?v=dQw4w9WgXcQ" ><img
src="/maket/img/insta.png" alt="insta"></a>
<a target="_blank" href="https://www.youtube.com/watch?v=QH2-TGUlwu4"><img
src="/maket/img/twitter.png" alt="twitter"></a>
</div>
<div class="brflex__item">
<p>Please Feel Free To Contact With Me For Any Kind of Project.</p>
</div>
</div>
</div>
</div>
</main>
</body>
</html>