-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
141 lines (141 loc) · 7.8 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
<!DOCTYPE html>
<html>
<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">
<title>Home</title>
<link rel="stylesheet" href="./css/main.min.css">
</head>
<body>
<canvas></canvas>
<main class="main" id="main">
<section class="hero">
<div class="container hero--wrapper">
<h1 class="hero__title">.qmpwwsd<b class="insert">studio</b></h1><a class="scroll-next" href="#about"><span class="scroll-next__dot"></span></a>
</div>
</section>
<section class="about" id="about">
<div class="container about--wrapper">
<div class="about__img"></div>
<div class="about__description profile">
<h2 class="title profile__title">This is <b class="insert">qmpwwsd</b></h2>
<p class="profile__description">Далеко-далеко, за словесными горами в стране гласных и согласных живут рыбные тексты. Наш встретил решила скатился дал буквенных однажды страна там. Букв ты реторический залетают толку заглавных агентство семь рекламных над дорогу!</p><a class="hero__link link">Read more</a>
</div>
</div>
</section>
<section class="more-about">
<div class="container more-about--wrapper">
<h2 class="title more-about__title">Details about <b class="insert">qmpwwsd</b></h2>
<p class="more-about__description">Lorem ipsum dolor sit amet consectetur, adipisicing elit. Magnam nobis esse, officiis laborum reprehenderit distinctio.</p>
<div class="more-about__img"></div>
</div>
</section>
<section class="portfolio">
<h2 class="portfolio__title">Works</h2>
<div class="portfolio__works works">
<div class="works__item work-1">
<h3 class="work__title">Lorem, ipsum.</h3>
<p class="work__description">Далеко-далеко за словесными горами в стране гласных и согласных, живут рыбные тексты.</p>
</div>
<div class="works__item work-2">
<h3 class="work__title">Lorem, ipsum.</h3>
<p class="work__description">Далеко-далеко за словесными горами в стране гласных и согласных, живут рыбные тексты.</p>
</div>
<div class="works__item work-3">
<h3 class="work__title">Lorem, ipsum.</h3>
<p class="work__description">Далеко-далеко за словесными горами в стране гласных и согласных, живут рыбные тексты.</p>
</div>
<div class="works__item work-4">
<h3 class="work__title">Lorem, ipsum.</h3>
<p class="work__description">Далеко-далеко за словесными горами в стране гласных и согласных, живут рыбные тексты.</p>
</div>
<div class="works__item work-5">
<h3 class="work__title">Lorem, ipsum.</h3>
<p class="work__description">Далеко-далеко за словесными горами в стране гласных и согласных, живут рыбные тексты.</p>
</div>
<div class="works__item work-6">
<h3 class="work__title">Lorem, ipsum.</h3>
<p class="work__description">Далеко-далеко за словесными горами в стране гласных и согласных, живут рыбные тексты.</p>
</div>
<div class="works__item work-7">
<h3 class="work__title">Lorem, ipsum.</h3>
<p class="work__description">Далеко-далеко за словесными горами в стране гласных и согласных, живут рыбные тексты.</p>
</div>
<div class="works__item work-8">
<h3 class="work__title">Lorem, ipsum.</h3>
<p class="work__description">Далеко-далеко за словесными горами в стране гласных и согласных, живут рыбные тексты.</p>
</div>
<div class="works__item work-9">
<h3 class="work__title">Lorem, ipsum.</h3>
<p class="work__description">Далеко-далеко за словесными горами в стране гласных и согласных, живут рыбные тексты.</p>
</div>
</div>
</section>
<section class="services">
<div class="container services--wrapper">
<h2 class="title services__title">Services</h2>
<ul class="services__box box-group">
<li class="box-group__item"><span class="box-group__icon"></span>
<h3 class="box-group__caption">Design</h3>
</li>
<li class="box-group__item"><span class="box-group__icon"></span>
<h3 class="box-group__caption">Web-site</h3>
</li>
<li class="box-group__item"><span class="box-group__icon"></span>
<h3 class="box-group__caption">Responsive</h3>
</li>
<li class="box-group__item"><span class="box-group__icon"></span>
<h3 class="box-group__caption">Cross-browser</h3>
</li>
<li class="box-group__item"><span class="box-group__icon"></span>
<h3 class="box-group__caption">Animations</h3>
</li>
<li class="box-group__item"><span class="box-group__icon"></span>
<h3 class="box-group__caption">Lorem</h3>
</li>
<li class="box-group__item"><span class="box-group__icon"></span>
<h3 class="box-group__caption">Animations</h3>
</li>
<li class="box-group__item"><span class="box-group__icon"></span>
<h3 class="box-group__caption">Lorem</h3>
</li>
</ul>
</div>
</section>
</main>
<footer class="footer" id="footer">
<div class="container footer--wrapper">
<h2 class="footer__title">Contact with me</h2>
<ul class="footer__menu social-menu">
<li class="social-menu__item"><a class="social-menu__link facebook">facebook
<svg>
<use xlink:href="/img/sprite.svg#facebook"></use>
</svg></a></li>
<li class="social-menu__item"><a class="social-menu__link telegram">telegram
<svg>
<use xlink:href="/img/sprite.svg#telegram"></use>
</svg></a></li>
<li class="social-menu__item"><a class="social-menu__link twitter">twitter
<svg>
<use xlink:href="/img/sprite.svg#twitter"></use>
</svg></a></li>
<li class="social-menu__item"><a class="social-menu__link instagram">instagram
<svg>
<use xlink:href="/img/sprite.svg#instagram"></use>
</svg></a></li>
<li class="social-menu__item"><a class="social-menu__link linkedin">linkedin
<svg>
<use xlink:href="/img/sprite.svg#linkedin"></use>
</svg></a></li>
<li class="social-menu__item"><a class="social-menu__link github">github
<svg>
<use xlink:href="/img/sprite.svg#github"></use>
</svg></a></li>
</ul>
</div>
<div class="footer__linse"></div>
</footer>
<script src="./js/script.js"></script>
</body>
</html>