-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
115 lines (104 loc) · 4.21 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
<!DOCTYPE html>
<html>
<head>
<title>Home</title>
<link href="./css/flexboxgrid.css" rel="stylesheet" type="text/css">
<link href="./css/style.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="./css/pe-icon-7-stroke.css" type="text/css">
<link rel="stylesheet" href="./css/helper.css" type="text/css">
</head>
<body>
<header id="main_header">
<div class="container">
<div class="row center-xs end-sm end-md end-lg middle-sm middle-md middle-lg top_header">
<div class="col xs-12 col-sm-2 col-md-2 col-lg-2">
<img id="logo" src="./img/logo.svg" placeholder="logo">
</div>
<div class="col xs-12 col-sm-10 col-md-10 col-lg-10">
<nav>
<ul>
<li><a class="active" href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Work</a></li>
<li><a href="#">Process</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Testimonials</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col xs-12 col-sm-7 col-lg-7"></div>
<div class="col xs-12 col-sm-5 col-lg-5 hero_title">
<h1 class="hero_heading">We Design and Develop</h1>
<p class="hero_text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,</p>
<button class="button"><a href="#">Contact us</a></button>
</div>
</div>
</div>
</div>
</header>
<div class="container">
<div class="row center-xs center-sm center-md center-lg about-us">
<div class="col xs-12 col-sm-8 col-md-8 col-lg-8">
<h1 class="about_heading">About Us</h1>
<p class="about_text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex</p>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col xs-12 col-sm-12 col-md-6 col-lg-6 professional">
<h1 class="pro_title">Professional Skills</h1>
<div class="pro_text">
<h4 class="ui">ui/ux design <span class="percentage">75%</span></h4>
<div class="w3-light-grey">
<div id="myBar" class="w3-container w3-green" style="height:24px;width:1%"></div>
</div>
<h4 class="web">web development <span class="percentage">90%</span></h4>
<h4 class="marketing">marketing <span class="percentage">65%</span></h4>
</div>
</div>
<div class="col xs-12 col-sm-12 col-md-6 col-lg-6 professional_image">
</div>
</div>
</div>
<div class="container">
<div class="row center-xs center-sm center-md center-lg stats">
<div class="col xs-12 col-sm-3 col-md-3 col-lg-3">
<i class="pe-7s-album pe-5x"></i>
<h3>548</h3>
<h3>project completed</h3>
</div>
<div class="col xs-12 col-sm-3 col-md-3 col-lg-3">
<i class="pe-7s-home"></i>
<h3>1465</h3>
<h3>working hours</h3>
</div>
<div class="col xs-12 col-sm-3 col-md-3 col-lg-3">
<i class="pe-7s-home"></i>
<h3>612</h3>
<h3>positive feedbacks</h3>
</div>
<div class="col xs-12 col-sm-3 col-md-3 col-lg-3">
<i class="pe-7s-home"></i>
<h3>6122</h3>
<h3>negative feedbacks</h3>
</div>
</div>
</div>
<div id="masonry">
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/4273/1.jpg">
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/4273/2.jpg">
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/4273/3.jpg">
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/4273/4.jpg">
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/4273/6.jpg">
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/4273/8.jpg">
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/4273/9.jpg">
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/4273/7.jpg">
</div>
</body>
</html>