-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathsingolo1.html
105 lines (105 loc) · 5.87 KB
/
singolo1.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Singolo</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css" integrity="sha256-l85OmPOjvil/SOvVt3HnSSjzF1TUMyT9eV0c2BzEGzU=" crossorigin="anonymous"/>
<link rel="stylesheet" href="singolo1.css">
</head>
<body>
<header class="header">
<div class="container">
<div class="header__block">
<a href="#">
<h1 class="logo">SINGOLO<span>*</span>
</h1>
</a>
<nav>
<ul class="header__navigation">
<li>
<a href="#">HOME</a>
</li>
<li>
<a href="#">SERVICES</a>
</li>
<li>
<a href="#">PORTFOLIO</a>
</li>
<li>
<a href="#">ABOUT</a>
</li>
<li>
<a href="#">CONTACT</a>
</li>
</ul>
</nav>
</div>
</div>
</header>
<section class="slider">
<div class="container">
<div class="slider__block">
<button class="left-button" type="button"></button>
<img src="assets/images/slider/phone_vertical.png" alt="phone_vertical" class="phone-one">
<img src="assets/images/slider/phone_horizontal.png" alt="phone_horizontal" class="phone_two">
<button class="right-button" type="button"></button>
</div>
</div>
</section>
<section class="services">
<div class="container">
<div class="services__block">
<h2 class="header">Our Services</h2>
<p class="description">
Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum. Duis mollis, non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh.
</p>
<div class="services__items">
<div class="services__item">
<div class="services__item image"><img src="assets/icons/services/pen.svg" alt="pen"></div>
<div class="services__item-column">
<h3 class="header">Custom Design</h3>
<p class="description">Curabitur vestibulum eget mauris quis laoreet. Phasellus in quam laoreet, viverra lacus ut, ultrices velit.</p>
</div>
</div>
<div class="services__item">
<div class="services__item image"><img src="assets/icons/services/bulb.svg" alt="bulb"></div>
<div class="services__item-column">
<h3 class="header">Inovative Ideas</h3>
<p class="description">Quisque luctus, quam eget molestie com-<br>modo, lacus purus cursus purus, nec rutrum tellus dolor id lorem.</p>
</div>
</div>
<div class="services__item">
<div class="services__item image"><img src="assets/icons/services/heart.svg" alt="heart"></div>
<div class="services__item-column">
<h3 class="header">Love Is The Answer</h3>
<p class="description">Nulla sed nunc et tortor luctus faucibus. Morbi at aliquet turpis, et consequat felis. Quisque condimentum.</p>
</div>
</div>
<div class="services__item">
<div class="services__item image"><img src="assets/icons/services/phone.svg" alt="phone"></div>
<div class="services__item-column">
<h3 class="header">Responsive Layout</h3>
<p class="description">Sed porttitor placerat rhoncus. In at nunc tellus. Maecenas blandit nunc ligula. Prae-<br>sent elit leo.</p>
</div>
</div>
<div class="services__item">
<div class="services__item image"><img src="assets/icons/services/bubble.svg" alt="bubble"></div>
<div class="services__item-column">
<h3 class="header">24 / 7 Support</h3>
<p class="description">Vivamus vel quam lacinia, tincidunt dui non, vehicula nisi. Nulla a sem erat. Pellen- tesque egestas venenatis lorem.</p>
</div>
</div>
<div class="services__item">
<div class="services__item image"><img src="assets/icons/services/star.svg" alt="star"></div>
<div class="services__item-column">
<h3 class="header">Feel Like A Star</h3>
<p class="description">Quisque hendrerit purus dapibus, ornare nibh vitae, viverra nibh. Fusce vitae aliquam tellus.</p>
</div>
</div>
</div>
</div>
</div>
</section>
</body>
</html>