-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathdesign5.html
122 lines (109 loc) · 5.12 KB
/
design5.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
<!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 rel="stylesheet" href="./css/design5.css">
<script src="https://kit.fontawesome.com/ff32cb2647.js" crossorigin="anonymous"></script>
<title>Design 5</title>
</head>
<body>
<header class="banner ">
<div class="content">
<h1 class="title">Where does it all come from?</h1>
<p class="subtitle">It is a long established fact that a reader is distracted</p>
</div>
<nav class="navbar" id="nav-bar">
<a class="navbar-brand text-dark" href="#">
<i class="fa fa-3x fa-bullseye" aria-hidden="true"></i>
</a>
<div id="navlist">
<div class="navlist-right">
<a href="#">Home</a>
<a href="#">Our Products</a>
<a href="#">Careers</a>
<a href="#">About Us</a>
<a href="#">Contact Us</a>
<a href="#"><i class="fa fa-search" aria-hidden="true"></i></a>
<a href="#"><i class="fa fa-bars" aria-hidden="true"></i></a>
</div>
</div>
</nav>
</header>
<div class="container">
<div class="col-1">
<h2 class="title left-title ">Lorem ipsum has been the industry's standard dummy text ever since the 1500s</h2>
<div class="badge">
<ul type="none">
<li><i class="far fa-question-circle"></i></li>
<li><i class="fab fa-wordpress-simple"></i></li>
<li><i class="far fa-user-circle"></i></li>
<li><i class="far fa-arrow-alt-circle-up"></i></li>
</ul>
</div>
<img src="./images/banner1.jpg" alt="" class="image-1">
<div class="left-title">
<p class="para1">Lorem ipsum dolor sit amet consectetur adipisicing elit. Dignissimos dolor aliquam sequi
recusandae quia
aperiam architecto sunt maxime illum exercitationem hic voluptatum quibusdam quae animi ex aut fuga fugit
optio
eius dicta dolorem, velit libero? Ratione labore reiciendis excepturi fugiat.</p>
<p class="para2">Lorem ipsum dolor sit amet consectetur adipisicing elit. Quam eaque, rem minima aut saepe
quis reprehenderit, distinctio dolore doloribus magnam et veritatis vel, vitae at? Debitis iure eius tenetur
nulla, repellat ipsum totam recusandae sequi perferendis tempora placeat amet quos dolore optio corporis
nostrum
sapiente praesentium assumenda error vero nesciunt!</p>
<p class="para3">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Tenetur aperiam voluptatem culpa
velit
ipsa eum ipsam
eligendi quos atque incidunt, consequuntur et! Alias, vel, suscipit aut vero maxime illo consequatur error
perspiciatis odio debitis dolorum ducimus cupiditate vitae qui doloribus. Distinctio blanditiis quas obcaecati
labore nemo deleniti iure consequatur ea, maiores suscipit nulla fugiat ullam, possimus aliquam aspernatur
voluptate impedit, ratione at voluptates! Quam deleniti, alias voluptate dolores natus nam deserunt, beatae
omnis neque modi non eum nemo nesciunt minus!lorem30
Lorem ipsum dolor sit amet consectetur adipisicing elit. Similique expedita cumque labore eveniet ullam, ab
nisi
ipsum nam reprehenderit soluta sunt cupiditate aperiam, natus earum incidunt tempora laborum exercitationem
necessitatibus.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Magnam soluta corrupti, praesentium sit cum aut
harum debitis dolorum velit ducimus.</p>
</div>
</div>
<div class="col-2">
<h3>Lorem ipsum dolor sit amet consectetur ?</h3>
<img src="./images/banner1.jpg" alt="" class="image2">
<div class="text-center">
<div><button class="btn">Subcribe</button><span>lorem ipsum</span></div>
<div>
<h4>Lorem ipsum dolor sit amet ?</h4>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Natus magni hic
</p>
<p class="text-green">
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Alias doloremque
</p>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Maxime debitis a eum, nemo animi ab.</p>
</div>
<div>
<h4>Lorem ipsum dolor sit amet .?</h4>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Natus magni
</p>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. officiis nihil
aperiam.</p>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eveniet
aperiam.</p>
</div>
<div>
<h4>Lorem ipsum dolor sit amet?</h4>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Natus magni
recusandae illo odio quos?</p>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Omnis,
aperiam.</p>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. !</p>
</div>
</div>
</div>
</div>
</div>
</body>
</html>