Repository navigation
Expand file tree
/
Copy pathindex.html
More file actions
279 lines (245 loc) · 14 KB
/
Copy pathindex.html
File metadata and controls
279 lines (245 loc) · 14 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Thumbnails</title>
<link rel="stylesheet" href="./css/style.css">
<link rel="apple-touch-icon" sizes="180x180" href="img/favicon/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="img/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="img/favicon/favicon-16x16.png">
<link rel="manifest" href="img/favicon/site.webmanifest">
<link rel="mask-icon" href="img/favicon/safari-pinned-tab.svg" color="#5bbad5">
<link rel="shortcut icon" href="img/favicon/favicon.ico">
<meta name="msapplication-TileColor" content="#00aba9">
<meta name="msapplication-config" content="img/favicon/browserconfig.xml">
<meta name="theme-color" content="#ffffff">
</head>
<body>
<!-- Header start -->
<header class="header">
<div class="wrapper">
<div class="header__wrapper">
<div class="header__logo">
<a href="#start" class="header__logo-link js-scroll">
<img src="./img/svg/logo.svg" alt="Thumbnails" class="header__logo-pic">
</a>
</div>
<nav class="header__nav">
<ul class="header__list">
<li class="header__item">
<a href="#benefits" class="header__link js-scroll">Benefits</a>
</li>
<li class="header__item">
<a href="#Portfolio" class="header__link js-scroll">Portfolio</a>
</li>
<li class="header__item">
<a href="www.linkedin.com/in/yehor-konyukhov-a4390b29a" class="header__link">LinkedIn</a>
</li>
<li class="header__item">
<a href="#buy-now" class="header__link js-scroll">Buy Now</a>
</li>
</ul>
<div class="header__nav-close">
<span class="header__nav-close-line"></span>
<span class="header__nav-close-line"></span>
</div>
</nav>
<div class="header__burger burger">
<span class="burger__line burger__line_first"></span>
<span class="burger__line burger__line_second"></span>
<span class="burger__line burger__line_third"></span>
</div>
</div>
</div>
</header>
<!-- Header end -->
<main class="main">
<!-- Intro start -->
<section class="intro" id="start">
<div class="wrapper">
<h1 class="intro__title">
Premium Youtube Thumbnails
</h1>
<p class="intro__subtitle">
Transform your ideas, elevate your content, and gain more viewers with Thumbnail Magic. I will provide you with eye-catching designs that could be the turning point in your career.
</p>
<p class="intro-links">
<button class="button-intro">
<a href="#benefits" class="button-intro-link js-scroll">Benefits</a>
</button>
<button class="button-intro">
<a href="#Portfolio" class="button-intro-link js-scroll">Portfolio</a>
</button>
<button class="button-intro">
<a href="#buy-now" class="button-intro-link js-scroll">Buy now</a>
</button>
<button class="button-intro">
<a href="www.linkedin.com/in/yehor-konyukhov-a4390b29a" class="button-intro-link js-scroll">LinkedIn</a>
</button>
</p>
</div>
</section>
<!-- Intro end -->
<section class="about-me">
<div class="wrapper-full">
<div class="portolio__caption">
<h2 class="portolio__title section-title">
Information about me
</h2>
</div>
</div>
<div class="wrapper-full">
<div class="about-me-list">
<img src="./img/pfp.jpg" alt="pfp" width="300px" height="300px" class="about-me-list-img">
<div class="text" >
<p>
Hello! My name is Yegor, I’m 19 years old and I live in Ukraine. Previously, I worked on Ukrainian freelance services and did a lot of work, but now I am ready to continue my journey and work on international level. I have been studying thumbnail creation for about a year, so I’m ready to turn my knowledge into thumbnails. My second area is Figma, I've been working in it for several month, and site which you scrolling right now is designed by me. With Figma I can also create business-type thumbnails that can be good for more formal videos. Waiting for your order!
</p>
</div>
</div>
</div>
</section>
<!-- Benefites start -->
<section class="portolio" id="benefits">
<div class="wrapper-full">
<div class="portolio__caption">
<h2 class="portolio__title section-title">
What are my benefits?
</h2>
</div>
</div>
</section>
<div class="benefits">
<div class="wrapper-full">
<div class="benefits__benefit benefits">
<div class="benefits__pic">
<img src="./img/quality.png" alt="Prefecture in Focus: Tottori" class="benefits__thumb">
</div>
<div class="benefits__info">
<h3 class="benefits__title">
High Quality
</h3>
<p class="benefits__desc">
Crafting vibrant thumbnails is essential for grabbing attention. Strategic use of brightness and saturation enhances visual appeal, making your content stand out. Find the right balance to align with your brand, creating thumbnails that entice viewers and boost click-through rates. Consistency in style builds a recognizable visual identity for your content.
</p>
</div>
</div>
<div class="benefits__benefit benefits">
<div class="benefits__info">
<h3 class="benefits__title">
Resonable prices
</h3>
<p class="benefits__desc">
My pricing model is the result of thorough analysis on various freelance platforms, where I've invested considerable time to calculate the optimal value for the services I provide. This meticulous approach ensures that my clients receive exceptional value for their investment in my services.
</p>
</div>
<div class="benefits__pic benefits__pic_mob-first">
<img src="./img/dollar.png" alt="Featured Neighborhood: Kyoto’s Arashiyama" class="benefits__thumb">
</div>
</div>
<div class="benefits__benefit benefits">
<div class="benefits__pic">
<img src="./img/LAMP.png" alt="Prefecture in Focus: Tottori" class="benefits__thumb">
</div>
<div class="benefits__info">
<h3 class="benefits__title">
Creative ideas
</h3>
<p class="benefits__desc">
If you're seeking a captivating concept for your thumbnail, I'm here to offer a wealth of intriguing ideas and creative solutions. Let's collaborate to ensure your thumbnail stands out and captures the attention of your audience.
</p>
</div>
</div>
<div class="benefits__benefit benefits">
<div class="benefits__info">
<h3 class="benefits__title">
Quick completion
</h3>
<p class="benefits__desc">
In the dynamic landscape of today's demands, I not only recognize the importance of rapid completion but also commit to delivering your projects with precision and efficiency. Timeliness is a hallmark of my service, ensuring that your expectations are not just met but exceeded.
</p>
</div>
<div class="benefits__pic benefits__pic_mob-first">
<img src="./img/CLOCK.png" alt="Featured Neighborhood: Kyoto’s Arashiyama" class="benefits__thumb">
</div>
</div>
</div>
</div>
<!-- Benefites start -->
<!-- Portfolio start -->
<section class="portolio" id="Portfolio">
<div class="wrapper-full">
<div class="portolio__caption">
<h2 class="portolio__title section-title">
Take a look at my portfolio
</h2>
</div>
<div class="portolio__cards">
<div class="portolio__card portolio__card_size_lg">
<img src="./img/1.jpg" alt="Mount Fuji" class="portolio__card-pic portolio__card-pic_size_lg">
<a href="#!" class="portolio__card-link"></a>
</div>
<div class="portolio__card portolio__card_size_lg">
<img src="./img/2.jpg" alt="Kyoto" class="portolio__card-pic portolio__card-pic_size_lg">
<a href="#!" class="portolio__card-link"></a>
</div>
<div class="portolio__card portolio__card_size_sm">
<img src="./img/3.jpg" alt="Tokyo" class="portolio__card-pic portolio__card-pic_size_sm">
<a href="#!" class="portolio__card-link"></a>
</div>
<div class="portolio__card portolio__card_size_sm">
<img src="./img/4.jpg" alt="Niigata" class="portolio__card-pic portolio__card-pic_size_sm">
<a href="#!" class="portolio__card-link"></a>
</div>
<div class="portolio__card portolio__card_size_sm">
<img src="./img/5.jpg" alt="Sapporo" class="portolio__card-pic portolio__card-pic_size_sm">
<a href="#!" class="portolio__card-link"></a>
</div>
<div class="portolio__card portolio__card_size_lg">
<img src="./img/6.jpg" alt="Mount Fuji" class="portolio__card-pic portolio__card-pic_size_lg">
<a href="#!" class="portolio__card-link"></a>
</div>
<div class="portolio__card portolio__card_size_lg">
<img src="./img/7.jpg" alt="Kyoto" class="portolio__card-pic portolio__card-pic_size_lg">
<a href="#!" class="portolio__card-link"></a>
</div>
<div class="portolio__card portolio__card_size_sm">
<img src="./img/8.jpg" alt="Tokyo" class="portolio__card-pic portolio__card-pic_size_sm">
<a href="#!" class="portolio__card-link"></a>
</div>
<div class="portolio__card portolio__card_size_sm">
<img src="./img/9.jpg" alt="Niigata" class="portolio__card-pic portolio__card-pic_size_sm">
<a href="#!" class="portolio__card-link"></a>
</div>
<div class="portolio__card portolio__card_size_sm">
<img src="./img/10.jpg" alt="Sapporo" class="portolio__card-pic portolio__card-pic_size_sm">
<a href="#!" class="portolio__card-link"></a>
</div>
</div>
</div>
</section>
<!-- Portfolio end -->
<!-- End -->
<section class="end" id="start">
<div class="wrapper">
<div class="last-wrapper">
<form action="form.php" method="post" class="form" id="buy-now">
<div class="form-text-title">
READY TO BETTER YOUR CONTENT?
</div>
<p class="form-text">
Enter your information in the form below and I will reach out to you soon. You can also reach out to my
<a href="www.linkedin.com/in/yehor-konyukhov-a4390b29a" class="linkedin"> LinkedIn</a>
</p>
<input type="text" name="name" class="form_input" placeholder="Name">
<input type="email" name="email" class="form_input" placeholder="Email">
<textarea name="message" placeholder="Message", class="form_textarea"></textarea>
<button type="submit" class="form_button">Send it</button>
</form>
</div>
</div>
</section>
<script src="./js/main-es5.min.js"></script>
</body>
</html>