-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
169 lines (154 loc) · 9.12 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
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
<!DOCTYPE html>
<html lang="en">
<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">
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300&family=Roboto:wght@100&display=swap" rel="stylesheet">
<script src="https://kit.fontawesome.com/4678d1b0a4.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="assets/stylesheet/style.css">
<title>Checkpoint-02</title>
</head>
<body id="top">
<header>
<div class="container flex-header">
<nav class="social-icon">
<a href="#"><i class="fab fa-facebook-f"></i></a>
<a href="#"><i class="fab fa-twitter"></i></a>
<a href="#"><i class="far fa-futbol"></i></a>
<a href="#"><i class="fab fa-linkedin-in"></i></a>
</nav>
<div class="header color">
<div class="logo-flex">
<img src="assets/media/logo.png" alt="logo">
<span class="span">Flex<span>
</div>
<nav class="Pages">
<a href="#" class="home">Home</a>
<a href="#">Service</a>
<a href="#">Portfolio</a>
<a href="#">Team</a>
<a href="gallery.html">Gallery</a>
<a href="#">Contact</a>
</nav>
</div>
<div class="digital">
<h2>DIGIAL MARKETING</h2>
<hr>
<p>MORE VISITOR TO YOUR WEBSITE</p>
<a class="square-box" href="#">LET US DESIGN</a>
</div>
</header>
<main>
<section>
<div class="dots">
<span class="first-dot"></span>
<span></span>
<span></span>
</div>
<!-- our services -->
<div class="digital services">
<h2>OUR SERVICES</h2>
<P>WE DESIGN MOBILE-FIRST WEBSITE FOR YOU</P>
</div>
<div class="boxes">
<div class="box box-1 item-center"><i class="far fa-file-code"></i></div>
<div class="box box-2 item-center"><i class="fab fa-telegram-plane"></i></div>
<div class="box box-3 item-center"><i class="fas fa-university"></i></div>
<div class="box box-4 item-center"><i class="fas fa-flask"></i></div>
</div>
<!-- our portfolio -->
<div class="digital services">
<h2>OUR PORFOLIO</h2>
<P>AMAZING WORK FOR OUR CLIENTS</P>
</div>
<div class="flex">
<img src="assets/media/portfolio/p1.jpg" alt="pic1" class="port">
<img src="assets/media/portfolio/p2.jpg" alt="pic1" class="port">
<img src="assets/media/portfolio/p3.jpg" alt="pic1" class="port">
<img src="assets/media/portfolio/p4.jpg" alt="pic1" class="port">
</div>
<div class="flex">
<img src="assets/media/portfolio/p5.jpg" alt="pic1" class="port">
<img src="assets/media/portfolio/p6.jpg" alt="pic1" class="port">
<img src="assets/media/portfolio/p7.jpg" alt="pic1" class="port">
<img src="assets/media/portfolio/p8.jpg" alt="pic1" class="port">
</div>
<!-- ----our team---- -->
<div class="digital services">
<h2>OUR TEAM</h2>
<P>OUR PEOPLE ARE VERY UNITED FOR YOUR SUCCESS</P>
</div>
<div class="imgcircle">
<img src="assets/media/team/member1.jpg " alt="member-1" class="c-img">
<img src="assets/media/team/member2.jpg " alt="member-2" class="c-img">
<img src="assets/media/team/member3.jpg " alt="member-3" class="c-img">
<img src="assets/media/team/member4.jpg " alt="member-4" class="c-img">
</div>
<!-- -----our skills --------->
<div class="skills">
<h2>DESIGN SKILLS</h2>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit.<p>
</div>
<div class="textleft">
<p>Aliquam Faucibus in dolor sed vestibulum. Sed adipiscing malesuada luctus. morbi tincidunt, tllus scelerisque scelerisque, sapien dui pretium augue, at consectetur sapien tellus vitae nunc. ut vitae metius quis nulls cursus adipiscing pretium vel dolor. Fusce lacinia accumasn arcu, quis porttitor nisi tincidunt ut. Nunc malesuada nunc eget nunc sollicitudin posuere. maecenas vitae tortor quis odio henderit sagittis.
<br>
Please visit <span class="red-text">Too CSS</span> to see collections of free HTML CSS templates for your websites. Etiam tincidunt, mgnma eu elementum tristique, sapien nisl venenatis lacus Lorem ipsum dolor sit amet consectetur adipisicing elit. Omnis esse porro asperiores praesentium nobis harum pariatur totam voluptas illo eaque numquam id repellendus error, doloremque fugit alias. Libero, vitae ex?lorem
</p>
<div class="col5 ">
<div class="box1">
<div class="box--1">
<div class="span-para">photoshop 90%</div>
</div>
</div>
<div class="box1">
<div class="box--2">
<div class="span-para">html css 80%</div>
</div>
</div>
<div class="box1">
<div class="box--3">
<div class="span-para">development 70%</div>
</div>
</div>
<div class="box1">
<div class="box--4">
<div class="span-para">marketting 80%</div>
</div>
</div>
</div>
</div>
<div class="digital services">
<h2>CONTACT</h2>
<P>SEND A MESSAGE TO US </P>
</div>
<div class="map-flex">
<iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d13503.55258991799!2d76.355385!3d32.2072445!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0x71ff0cae0784712d!2sAltCampus%20Services%20Pvt.%20Ltd!5e0!3m2!1sen!2sin!4v1630473637094!5m2!1sen!2sin" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy"></iframe>
</div>
<div class="contact-text flexer">
<p> Flex Template is based on Bootstrap v3.1.1 and it is provided by <strong class="b-text">template</strong><strong class="g-text">mo</strong> for free of charge. Slider images and portfolio images re from <strong class="r-text">Unsplash</strong> website. Thank you for visiting. Please tell your friends about our <strong class="bl-text">TemplateMo website.</strong> <br> Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorem possimus eveniet cumque tempora, est soluta saepe impedit sapiente esse error et neque iure facere similique doloribus ut, maxime expedita aspernatur. <br>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Delectus excepturi numquam exercitationem atque impedit, doloremque quo. Aperiam aut perferendis nisi ducimus dolores eveniet nobis. Assumenda cum eveniet dicta optio recusandae?</p>
<form action="/action_page.php">
<label for="fname"></label><br>
<input type="text" id="fname" name="fname" value="Your Name"><br>
<label for="fname"></label><br>
<input type="text" id="fname" name="fname" value="Your Email"><br>
<label for="fname"></label><br>
<input type="text" id="fname" name="fname" value="Subject"><br>
<label for="lname"></label><br>
<input type="text" id="lname" name="lname" value="Message"><br><br>
<div class="send">SEND MESSAGE</div>
</form>
</div>
<div class="div-center">
<div>Phone:033-033-0660</div>
<div>Email: <a class="mail" href="mailto:[email protected]">[email protected]</a> </div>
<div> Address:880 De Best studio, Fork Street, San francisco</div>
</div>
</section>
</main>
<footer>
<span> Copyright © 2020 Company Name. Design:TemplateMo </span>
<a class="top" href="#">BACK TO TOP</a>
</footer>
</body>
</html>