-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathindex.html
195 lines (194 loc) · 7.79 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
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
<!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">
<title>Moonshine Creative Agency</title>
<link rel="stylesheet" href="./Styles/index.css">
<link rel="icon" href="./image/FavIcon.png">
</head>
<body>
<nav>
<div id="nav">
<div id="logo">
<a href="./index.html"><img src="./image/moonShine.png" alt=""></a>
</div>
<div id="navButtons">
<div>
<a href="services.html">Services</a>
</div>
<div>
<a href="projects.html">Projects</a>
</div>
<div>
<a href="blogs.html">Blogs</a>
</div>
<div>
<a href="">What's Included?</a>
</div>
<div>
<a href="./contactUs.html">Contact</a>
</div>
</div>
</div>
</nav>
<main>
<div id="topDiv">
<img src="./image/Landing 1.jpg" alt="">
<div id="topDivBottom">
<div id="topLeft">
<p>
We are digital agency <br>
that create <span class="chColor">best</span> experience <br>
for your <span class="chColor">business.</span>
</p>
</div>
<div id="topRight">
<p>
Ac elit urna massa duis nunc, torotr hac. Sed in amet magna pretium, nec. Est odio viverra consectetur et morbi retium nisi leo ultrices.
</p>
<button id="meet">
Schedule a Meet →
</button>
</div>
</div>
</div>
<marquee behavior="scroll" direction="left" scrollAmount="10">
<div>
<div class="text">Years of experience</div>
<div class="box" style="background-color: #FF405B;">5+</div>
</div>
<div>
<div class="text">Completed Projects</div>
<div class="box" style="background-color: #7059F9;">80+</div>
</div>
<div>
<div class="text">Happy Customers</div>
<div class="box" style="background-color: #FFC96E;">50+</div>
</div>
<div>
<div class="text">Business Partners</div>
<div class="box" style="background-color: #43A047;">10+</div>
</div>
</marquee>
<div id="connect">
<div id="letsconnect">
<hr class="yellow">
<p>Let's connect</p>
</div>
<div>
<p>We <span class="chColor">help</span> to stay connected <br>
with your <span class="chColor">audience</span></p>
</div>
<div id="connectGrid">
<div id="leftSide">
<div>
<p>
Nullam malesuda aliquet pallentesque at nisi pulvinar varius.
Sit Purus imperdiet purus auctor lectus egestas. Facilisi
aliquam ut tincidunt amet morbi dui.
</p>
<a href="./contactUs.html">Connect Now</a>
</div>
<div id="bottomImg">
<img src="./image/midleft.jpg" alt="">
</div>
</div>
<div id="rightSide">
<img src="./image/midRight.jpg" alt="">
</div>
</div>
</div>
<div id="services">
<p>We <span class="chColor">Offer</span> a complete range of services for your <span class="chColor">business</span></p>
<div id="servicesGrid">
<!-- From Backend -->
</div>
</div>
<div id="headFAQ">
<hr class="yellow">
<p>Frequently Asked Question</p>
</div>
<div id="faq">
<div id="leftFAQ">
<div id="leftMidFAQ">
<h1>Our solutions make your lifes better</h1>
<p>Amet pellentesque vulputate feugiat posuere sagittis iaculis cras in. Ridiculus consectetur enim in duis vel congue ut sit at consequat.</p>
</div>
<div id="leftbottomFAQ">
<button id="contact" onclick="contact()">Contact Us →</button>
</div>
</div>
<div id="rightFAQ">
<div id="rightFAQ1">
<p class="question">01 Do you offer flexible payment terms?</p>
<p class="answer">Odio cursus dolor, pulvinar tincidunt nisi nisi, viverra eu.Integer at eget quam urna ultricies.</p>
</div>
<hr>
<div id="rightFAQ1">
<p class="question">02 What do you need to make estimate?</p>
<p class="answer">Odio cursus dolor, pulvinar tincidunt nisi nisi, viverra eu.Integer at eget quam urna ultricies.</p>
</div>
<hr>
<div id="rightFAQ1">
<p class="question">03 What field do you specialise in?</p>
<p class="answer">Odio cursus dolor, pulvinar tincidunt nisi nisi, viverra eu.Integer at eget quam urna ultricies.</p>
</div>
</div>
</div>
<div id="chat">
<p>Let's work something <span class="chColor">together</span></p>
<button onclick="contact()">Let's Chat →</button>
</div>
<hr id="blackHR">
</main>
<footer>
<div id="footerLeft">
<div id="logoImg">
<img src="./image/moonShine.png" alt="">
</div>
<div id="description">
<p>Moonshine is a digital agency that helps you make better experience iaculis cras in.</p>
</div>
<div id="compLogos">
<div><img src="./image/shopify.jpg" alt=""></div>
<div><img src="./image/facebook.jpg" alt=""></div>
<div><img src="./image/google.png" alt=""></div>
<div><img src="./image/compaq.png" alt=""></div>
</div>
</div>
<div id="footerRight">
<div id="company">
<p>Company</p>
<p><a href="projects.html">Our Work</a></p>
<p><a href="services.html">Services</a></p>
<p><a href="">Community</a></p>
<p><a href="">Carrer</a></p>
<p><a href="./signin.html">Admin</a></p>
</div>
<div id="resources">
<p>Resources</p>
<p><a href="">Help Center</a</p>
<p><a href="blogs.html">Blog</a></p>
<p><a href="">Terms & Conditions</a></p>
</div>
<div id="links">
<p>Links</p>
<p><a href="">Pricing</a></p>
<p><a href="">About</a></p>
<p><a href="">Learn</a></p>
<p><a href="">Corporate</a></p>
<p><a href="">News</a></p>
</div>
<div id="followus">
<p>Follow Us</p>
<p><a href="https://dribbble.com/shots/18261434-Sunshine-Digital-Agency-Landing-Page">Dribble</a></p>
<p><a href="https://www.instagram.com/">Instagram</a></p>
<p><a href="https://twitter.com/">Twitter</a></p>
</div>
</div>
</footer>
</body>
<script src="./Scripts/index.js"></script>
</html>