-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathsingolo1.html
166 lines (165 loc) · 7.26 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
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://fonts.googleapis.com/css?family=Lato:300,300i,400,400i,700,700i,900,900i&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css">
<link rel="stylesheet" href="singolo1.css">
<title>Singolo1</title>
</head>
<body>
<!--Main container-->
<div class="container">
<!--Header-->
<header class="head">
<div class="logo">
<p>singolo</p>
<p>*</p>
</div>
<div class="hh1"><h1>o</h1></div>
<nav class="navbar">
<ul>
<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>
</header>
<div class="head_btm">
</div>
<!--Horizontal phone-->
<!--Slider (area with telephones)-->
<main class="slider">
<div class="phone1shadow"><img src="assets/images/Shadow1.png" alt="Phone shadow"></div>
<div class="phone2shadow"><img src="assets/images/Shadow2.png" alt="Phone shadow"></div>
<div class="leftbtn"><button style="background-image: url(assets/images/leftarrow.png);
background-repeat: no-repeat" name="left"> </button>
</div>
<div class="rightbtn"><button style="background-image: url(assets/images/rightarrow.png);
background-repeat: no-repeat" name="right"> </button>
</div>
<div class="phone1bcg">
<div class="phone1pict"><img src="assets/images/phone1pic.png" alt="Phone display"></div>
</div>
<div class="phone1btn">
<div class="phone1btnsquare"></div>
<div class="phone1btInsquare"></div>
</div>
<div class="phone1speakcyrcle"></div>
<div class="phone1reddot"></div>
<div class="phone1speak"></div>
<!--Vertical phone-->
<div class="phone2bcg">
<div class="phone2pict"><img src="assets/images/phone2pic.png" alt="Phone display"></div>
</div>
<div class="phone2btn">
<div class="phone2btnsquare"></div>
<div class="phone2btInsquare"></div>
</div>
<div class="phone2speakcyrcle"></div>
<div class="phone2reddot"></div>
<div class="phone2speak"></div>
</main>
<div class="slider_btm">
</div>
<!--Area with servises descriptions-->
<div class="services">
<div class="h1prew">
<div class="serviseh1"> <h2>Our Services</h2>
</div>
<div class="servtext"> <p>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>
</div>
<!--Servise's descriptions-->
<div class="servlist">
<div>
<div>
<div class="servlist1logo">
<img src="assets/images/pen.png" alt="penicon">
</div>
<div class="servlist1h2">
<h2>Custom Design</h2>
</div>
<div class="servlist1descr">
<p>Curabitur vestibulum eget mauris quis laoreet.
Phasellus in quam laoreet, viverra lacus ut, ultrices velit.</p>
</div>
</div>
<div>
<div class="servlist4logo">
<img src="assets/images/phone.png" alt="phoneicon">
</div>
<div class="servlist4h2">
<h2>Responsive Layout</h2>
</div>
<div class="servlist4descr">
<p>Sed porttitor placerat rhoncus. In at nunc tellus.
Maecenas blandit nunc ligula. Praesent elit leo.</p>
</div>
</div>
</div>
<div>
<div>
<div class="servlist2logo">
<img src="assets/images/lamp.png" alt="lampicon">
</div>
<div class="servlist2h2">
<h2>Inovative Ideas</h2>
</div>
<div class="servlist2descr">
<p>Quisque luctus, quam eget molestie commodo, lacus purus cursus
purus, nec rutrum tellus dolor id lorem.</p>
</div>
</div>
<div>
<div class="servlist5logo">
<img src="assets/images/question.png" alt="questionicon">
</div>
<div class="servlist5h2">
<h2>24 / 7 Support</h2>
</div>
<div class="servlist5descr">
<p>Vivamus vel quam lacinia, tincidunt dui non, vehicula nisi.
Nulla a sem erat. Pellentesque egestas venenatis lorem .</p>
</div>
</div>
</div>
<div>
<div>
<div class="servlist3logo">
<img src="assets/images/heart.png" alt="hearticon">
</div>
<div class="servlist3h2">
<h2>Love Is The Answer</h2>
</div>
<div class="servlist3descr">
<p>Nulla sed nunc et tortor luctus faucibus.
Morbi at aliquet turpis, et consequat felis. Quisque condimentum.</p>
</div>
</div>
<div>
<div class="servlist6logo">
<img src="assets/images/star.png" alt="hearticon">
</div>
<div class="servlist6h2">
<h2>Feel Like A Star</h2>
</div>
<div class="servlist6descr">
<p>Quisque hendrerit purus dapibus, ornare nibh vitae, viverra nibh.
Fusce vitae aliquam tellus.</p>
</div>
</div>
</div>
</div>
<div class="bg_btm">
</div>
</div>
</div>
</body>
</html>