-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathSideMenu-demo-interior-design.html
More file actions
executable file
·559 lines (470 loc) · 25 KB
/
Copy pathSideMenu-demo-interior-design.html
File metadata and controls
executable file
·559 lines (470 loc) · 25 KB
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
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
<!DOCTYPE html>
<html dir="ltr" lang="en-US">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="author" content="SemiColonWeb" />
<!-- Stylesheets
============================================= -->
<link href="http://fonts.googleapis.com/css?family=Rubik:300,400,500,700|Playfair+Display:700,700i,900" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="css/bootstrap.css" type="text/css" />
<link rel="stylesheet" href="style.css" type="text/css" />
<link rel="stylesheet" href="css/dark.css" type="text/css" />
<!-- Home Demo Specific Stylesheet -->
<link rel="stylesheet" href="demos/interior-design/interior-design.css" type="text/css" />
<link rel="stylesheet" href="css/font-icons.css" type="text/css" />
<link rel="stylesheet" href="css/animate.css" type="text/css" />
<link rel="stylesheet" href="css/magnific-popup.css" type="text/css" />
<!-- Reader's Blog Demo Specific Fonts -->
<link rel="stylesheet" href="demos/interior-design/css/fonts.css" type="text/css" />
<link rel="stylesheet" href="css/responsive.css" type="text/css" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="css/colors.php?color=1c85e8" type="text/css" />
<!-- Document Title
============================================= -->
<title>Interior Design Studio | Canvas</title>
</head>
<body class="stretched side-push-panel">
<div id="side-panel">
<div id="side-panel-trigger-close" class="side-panel-trigger"><a href="#"><i class="icon-line-cross"></i></a></div>
<div class="side-panel-wrap">
<div class="widget clearfix">
<h4 class="t400">Index</h4>
<div class="line line-sm"></div>
<!-- Sidebar
============================================= -->
<div class="sidebar nobottommargin clearfix">
<div class="sidebar-widgets-wrap">
<div class="widget clearfix">
<!-- <div class="widget widget_links clearfix"> -->
<ul class="iconlist">
<li><i class="icon-file-alt"></i><a href="#">Chapter</a></li>
<ul>
<li><i class="icon-pencil2"></i><a href="#"> Lesson</a></li>
<ul>
<li><a href="#"><div>Home - Magazine</div></a></li>
<li><a href="#"><div>Home - Portfolio</div></a></li>
<li><a href="#"><div>Home - Portfolio</div></a></li>
<li><a href="#"><div>Home - Corporate</div></a></li>
<li><a href="#"><div>Home - Magazine</div></a></li>
</ul>
</ul>
</ul>
<ul class="iconlist">
<li><i class="icon-file-alt"></i><a href="#">Chapter</a></li>
<ul>
<li><i class="icon-pencil2"></i><a href="#"> Lesson</a></li>
<ul>
<li><a href="#" class="active"> <div>Home - Corporate</div> </a> </li>
<li><a href="#"><div>Home - Magazine</div></a></li>
<li><a href="#"><div>Home - Portfolio</div></a></li>
<li><a href="#"><div>Home - Corporate</div></a></li>
<li><a href="#"><div>Home - Magazine</div></a></li>
<li><a href="#"><div>Home - Portfolio</div></a></li>
<li><a href="#"><div>Home - Portfolio</div></a></li>
<li><a href="#"><div>Home - Corporate</div></a></li>
<li><a href="#"><div>Home - Magazine</div></a></li>
<li><a href="#"><div>Home - Portfolio</div></a></li>
<li><a href="#"><div>Home - Portfolio</div></a></li>
<li><a href="#"><div>Home - Corporate</div></a></li>
<li><a href="#"><div>Home - Magazine</div></a></li>
<li><a href="#"><div>Home - Portfolio</div></a></li>
<li><a href="#"><div>Home - Portfolio</div></a></li>
<li><a href="#"><div>Home - Corporate</div></a></li>
<li><a href="#"><div>Home - Magazine</div></a></li>
<li><a href="#"><div>Home - Portfolio</div></a></li>
</ul>
</ul>
</ul>
</div>
</div>
</div><!-- .sidebar end -->
</div>
</div>
</div>
<!-- Document Wrapper
============================================= -->
<div id="wrapper" class="clearfix">
<!-- Header
============================================= -->
<header id="header">
<div id="header-wrap">
<div class="container clearfix">
<div id="primary-menu-trigger"><i class="icon-reorder"></i></div>
<div class="row justify-content-xl-between justify-content-lg-between clearfix">
<div class="col-lg-2 col-12 d-flex align-self-center">
<!-- Logo
============================================= -->
<div id="logo">
<a href="demo-interior-design.html" class="standard-logo"><img src="images/logo.png" alt="Canvas Logo"></a>
<a href="demo-interior-design.html" class="retina-logo"><img src="images/logo@2x.png" alt="Canvas Logo"></a>
</div><!-- #logo end -->
</div>
<div class="col-lg-8 col-12 d-xl-flex d-lg-flex justify-content-xl-center justify-content-lg-center">
<!-- Primary Navigation
============================================= -->
<nav id="primary-menu" class="with-arrows fnone clearfix">
<ul>
<li class="current"><a href="#"><div>Home</div></a></li>
<li><a href="demos/interior-design/studio.html"><div>Studio</div></a>
<ul>
<li><a href="demos/interior-design/studio-single.html"><div>Minsk Belarus Studio</div></a></li>
<li><a href="demos/interior-design/studio-single.html"><div>Malibu Dream Airstream</div></a></li>
<li><a href="demos/interior-design/studio-single.html"><div>Modern Condo in City</div></a></li>
</ul>
</li>
<li><a href="demos/interior-design/about.html"><div>About</div></a></li>
<li><a href="demos/interior-design/faqs.html"><div>FAQs</div></a></li>
<li><a href="demos/interior-design/contact.html"><div>Contact</div></a></li>
</ul>
</nav><!-- #primary-menu end -->
</div>
<div class="col-lg-2 d-none d-lg-inline-flex d-xl-inline-flex justify-content-end nomargin">
<!-- Top Search
============================================= -->
<div id="side-panel-trigger" class="side-panel-trigger">
<a href="#" class="d-block d-lg-none"><i class="icon-line-lock"></i></a>
<a href="#" class="d-none d-lg-block">Index <i class="icon-line-arrow-right"></i></a>
</div><!-- #top-search end -->
</div>
<a href="#" class="d-block d-lg-none mobile-side-panel side-panel-trigger"><i class="icon-line-arrow-right"></i></a>
</div>
</div>
</div>
</header><!-- #header end -->
<!-- Slider
============================================= -->
<section id="slider" class="slider-element clearfix" style="height: 500px; background: url('demos/interior-design/images/hero-image.jpg') center center no-repeat; background-size: cover;">
<div class="vertical-middle">
<div class="container clearfix">
<div class="clearfix center divcenter" style="max-width: 700px;">
<div class="emphasis-title">
<h1 class="font-secondary" style="color: #FFF; font-size: 76px; font-weight: 900; text-shadow: 0 7px 10px rgba(0,0,0,0.07), 0 4px 4px rgba(0,0,0,0.2);">Design Studio.</h1>
<p style="font-weight: 300; opacity: .7; color: #FFF; text-shadow: 0 -4px 20px rgba(0, 0, 0, .25);">Sell your home to us and skip the hassle of<br>repairs, showings and months of uncertainty</p>
</div>
<div class="subscribe-widget" data-loader="button">
<div class="widget-subscribe-form-result"></div>
<form id="widget-subscribe-form" action="include/subscribe.php" method="post" class="nobottommargin" data-animate="fadeInUp">
<div class="input-group divcenter">
<input type="email" id="widget-subscribe-form-email" name="widget-subscribe-form-email" class="form-control form-control-lg not-dark required email" placeholder="Enter your Email Address.." style="border: 0; box-shadow: none; overflow: hidden;">
<div class="input-group-append">
<button href="#" class="button t400" type="submit" style="border-radius: 3px;">Subscribe</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</section>
<!-- Content
============================================= -->
<section id="content">
<div class="content-wrap notoppadding clearfix">
<div class="section notopmargin clearfix" style="padding: 80px 0">
<div class="container clearfix">
<div class="divcenter" style="max-width: 960px">
<div class="row clearfix">
<div class="col-12 col-md-4 center customers-count">
<div class="counter center counter-large font-primary"><span data-from="100" data-to="3583" data-refresh-interval="100" data-speed="2000" data-comma="true"></span></div>
<p>Happy Customers</p>
</div>
<div class="col-12 col-md-7 offset-md-1">
<blockquote class="quote nobottommargin">
<p>Efficiently synthesize magnetic niches via resource maximizing procrastinate adaptive web-readiness.</p>
<footer class="color">John Doe, Google Inc.</footer>
</blockquote>
</div>
</div>
</div>
</div>
</div>
<div class="container topmargin-lg bottommargin-lg clearfix">
<div class="divcenter" style="max-width: 960px">
<div class="heading-block center nobottomborder">
<h2 class="ls2 t700">Your Priority is our Priority</h2>
<span>Competently benchmark backward-compatible technologies vis-a-vis<br>parallel convergence. Rapidiously innovate stand-alone.</span>
</div>
<div class="tabs tabs-alt tabs-responsive tabs-justify clearfix" id="tab">
<ul class="tab-nav clearfix">
<li><a href="#tabs-1"><i class="icon-line2-key"></i>24x7 Available</a></li>
<li><a href="#tabs-2"><i class="icon-line2-social-dropbox"></i>Complete Solutions</a></li>
<li><a href="#tabs-3"><i class="icon-line2-drop"></i>Water Treatments</a></li>
<li><a href="#tabs-4"><i class="icon-line2-pointer"></i>Location Independant</a></li>
</ul>
<div class="tab-container">
<div class="tab-content clearfix" id="tabs-1">
<div class="story-box description-left clearfix">
<div class="story-box-image">
<img src="demos/interior-design/images/story/1.jpg" alt="story-image">
</div>
<div class="story-box-info">
<h3 class="story-title">We help people to create new Website.</h3>
<div class="story-box-content">
<p>Uniquely productize cross-unit action items with multifunctional imperatives. Quickly communicate collaborative relationships rather than timely materials. Progressively foster unique interfaces vis-a-vis backend e-services.</p>
<button class="t300 button noleftmargin button-rounded">Read Canvas's story</button>
</div>
</div>
</div>
</div>
<div class="tab-content clearfix" id="tabs-2">
<div class="story-box clearfix">
<div class="story-box-image">
<img src="demos/interior-design/images/story/2.jpg" alt="story-image">
</div>
<div class="story-box-info">
<h3 class="story-title">Get better results tomorrow by reading this post.</h3>
<div class="story-box-content">
<p>Progressively streamline future-proof networks rather than virtual channels. Intrinsicly architect performance based products with B2C communities. Appropriately underwhelm integrated information via superior platforms.</p>
<button class="t300 button noleftmargin button-rounded">Read More</button>
</div>
</div>
</div>
</div>
<div class="tab-content clearfix" id="tabs-3">
<div class="story-box description-left clearfix">
<div class="story-box-image">
<img src="demos/interior-design/images/story/3.jpg" alt="story-image">
</div>
<div class="story-box-info">
<h3 class="story-title">TK’s recipe of the week: Guiness beef stew.</h3>
<div class="story-box-content">
<p>Compellingly synthesize technically sound users without technically sound vortals. Rapidiously redefine maintainable leadership with multifunctional strategic theme areas. Appropriately plagiarize business ideas vis-a-vis.</p>
<button class="t300 button noleftmargin button-rounded">Read About Me</button>
</div>
</div>
</div>
</div>
<div class="tab-content clearfix" id="tabs-4">
<div class="story-box clearfix">
<div class="story-box-image">
<img src="demos/interior-design/images/story/4.jpg" alt="story-image">
</div>
<div class="story-box-info">
<h3 class="story-title">We help people to create new Website.</h3>
<div class="story-box-content">
<p>Dynamically exploit cross-platform sources vis-a-vis scalable paradigms. Efficiently plagiarize multifunctional internal or "organic" sources before intuitive innovation. Synergistically facilitate goal-oriented ROI vis-a-vis client-focused.</p>
<a href="#">Read Deanne's story</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="section bottommargin-lg dark" style="background: url('demos/interior-design/images/section/1.jpg') center 80%; background-size: cover; padding: 180px 0">
<div class="container clearfix">
<div class="emphasis-title divcenter center" style="max-width: 700px">
<h2 class="font-secondary ls1" style="font-size: 52px;">Welcome to a better way to Live your Life.</h2>
</div>
</div>
</div>
<div class="container clearfix">
<div class="emphasis-title center divcenter" style="max-width: 800px">
<h2 class="font-secondary nott t700">3,583 happy homeowners and counting...</h2>
</div>
<div class="row bottommargin clearfix">
<div class="col-lg-10 offset-lg-1 col-12">
<div class="review-row center">
<h6>Top Best Reviews of Canvas</h6>
</div>
</div>
<div class="clear"></div>
<div class="col-12 reviews-lists clearfix">
<div id="oc-team" class="owl-carousel team-carousel bottommargin carousel-widget" data-margin="0" data-pagi="false" data-items="1" data-loop="true" data-animate-in="fadeIn" data-animate-out="fadeOut" data-autoplay="5000">
<div class="oc-item">
<div class="row">
<div class="col-lg-10 offset-lg-1 col-12">
<div class="review clearfix">
<div class="row">
<div class="col-12 col-md-4">
<div class="review-company">Datanetpress</div>
<div class="review-id">Themeforest Author</div>
<div class="rating-stars fright">
<i class="icon-star3"></i><i class="icon-star3"></i><i class="icon-star3"></i><i class="icon-star3"></i><i class="icon-star3"></i>
</div>
<div class="review-date">
Sold 19/11/2016<br>
after 22 days
</div>
</div>
<div class="col-12 col-md-8">
<div class="review-title">
<h3>Awesome Template and Good Support.</h3>
</div>
<div class="review-content">
<p>Not only is this a REALLY professionally designed website, but the support is phenomenal. They have promptly answered all of my questions (and I had several :) ) Nice job SemiColonWeb!!! I highly recommend your HTML template to anyone looking for a website. Excellent, only gripe is the php email section, that needs to be better otherwise a brilliant template and set of codes. well done. Hello, I would like to say that :SemiColonWeb" has being the SUPER BEST CUSTOMER SERVICE I HAVE EVER HAD during all my year in Envato. This Guys are the Best, not only on Design by the most Important for us, in customer service. There are fast, super professional, on time and the most important they care about their clients. 100 BIG STARS FOR EVER!!!</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="oc-item">
<div class="row">
<div class="col-lg-10 offset-lg-1 col-12">
<div class="review clearfix">
<div class="row">
<div class="col-12 col-md-4">
<div class="review-company">VarunD</div>
<div class="review-id">Themeforest Author</div>
<div class="rating-stars">
<i class="icon-star3"></i><i class="icon-star3"></i><i class="icon-star3"></i><i class="icon-star3"></i><i class="icon-star3"></i>
</div>
<div class="review-date">
Sold 21/09/2016<br>
after 39 days
</div>
</div>
<div class="col-12 col-md-8">
<div class="review-title">
<h3>Nice Design Quality & Well Support.</h3>
</div>
<div class="review-content">
<p>Excellent, only gripe is the php email section, that needs to be better otherwise a brilliant template and set of codes. well done. Awesome theme. Using it for two different sites at the moment and it keeps on giving! Thanks SemiColonWeb! Love this template. one of the best I've worked with. Wow, very inspiring design and excellent code. One of the best HTML and bootstrap templates here on Themeforest with infinitely many features. Really Well Done! Flexible, easy to customize, amazing code quality and a good documentation. This theme fits well in various business strategies.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="oc-item">
<div class="row">
<div class="col-lg-10 offset-lg-1 col-12">
<div class="review clearfix">
<div class="row">
<div class="col-12 col-md-4">
<div class="review-company">Paultran47</div>
<div class="review-id">Themeforest Author</div>
<div class="rating-stars">
<i class="icon-star3"></i><i class="icon-star3"></i><i class="icon-star3"></i><i class="icon-star3"></i><i class="icon-star3"></i>
</div>
<div class="review-date">
Sold 03/01/2017<br>
after 11 days
</div>
</div>
<div class="col-12 col-md-8">
<div class="review-title">
<h3>The support is wonderful as well.</h3>
</div>
<div class="review-content">
<p>It's amazing that less than 20 dollars gets you more than 400 templates and a bunch of customisability. But what I love the most about Canvas's template is the clear and clean code structure. Everything is easy to understand and to find. This template is so well done, clean and well documented. Having examples for almost any variation that I can use as a basis. I find this much more efficient that website builders. Continue this great work! Really, really great job, guys!!</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col_one_third nobottommargin">
<div class="feature-box fbox-small fbox-center fbox-plain fbox-large nobottomborder">
<div class="fbox-icon">
<i class="icon-line2-home"></i>
</div>
<h3 class="ls0 t400 nott" style="font-size: 20px;">Commercial & Personal Use</h3>
<p style="font-size: 16px;">Proactively reintermediate B2C infomediaries before multimedia methods of empowerment.</p>
</div>
</div>
<div class="col_one_third nobottommargin">
<div class="feature-box fbox-small fbox-center fbox-plain fbox-large nobottomborder">
<div class="fbox-icon">
<i class="icon-line2-compass"></i>
</div>
<h3 class="ls0 t400 nott" style="font-size: 20px;">Vaastu Compliant</h3>
<p style="font-size: 16px;">Uniquely formulate principle-centered applications after just in time opportunities.</p>
</div>
</div>
<div class="col_one_third nobottommargin col_last">
<div class="feature-box fbox-small fbox-center fbox-plain fbox-large nobottomborder">
<div class="fbox-icon">
<i class="icon-line2-directions"></i>
</div>
<h3 class="ls0 t400 nott" style="font-size: 20px;">Great Location</h3>
<p style="font-size: 16px;">Collaboratively reinvent ubiquitous functionalities vis future-proof systems.</p>
</div>
</div>
</div>
</div>
</section><!-- #content end -->
<!-- Footer
============================================= -->
<footer id="footer" class="topmargin noborder" style="background-color: #F5F5F5;">
<div class="container clearfix">
<!-- Footer Widgets
============================================= -->
<div class="footer-widgets-wrap clearfix">
<div class="col_one_fourth">
<div class="widget clearfix">
<div class="t400 lowercase nobottommargin" style="font-size: 36px; letter-spacing: -1px">Canvas</div>
<p class="text-muted t300">@2017</p>
<div class="app-links">
<p>Get the app</p>
<a href="#" class="link"><i class="icon-android2"></i> <span>Download for Android</span></a><br>
<a href="#" class="link"><i class="icon-apple"></i> <span>Download for IOS</span></a><br>
</div>
</div>
</div>
<div class="col_one_fourth">
<div class="widget widget_links clearfix">
<h4>Blogroll</h4>
<ul>
<li><a href="#">Documentation</a></li>
<li><a href="#">Feedback</a></li>
<li><a href="#">Plugins</a></li>
<li><a href="#">Support Forums</a></li>
<li><a href="#">Themes</a></li>
</ul>
</div>
</div>
<div class="col_one_fourth">
<div class="widget widget_links clearfix">
<h4>Links</h4>
<ul>
<li><a href="#">About Us</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Licence</a></li>
<li><a href="#">Forums</a></li>
<li><a href="#">Terms</a></li>
</ul>
</div>
</div>
<div class="col_one_fourth col_last">
<div class="widget widget-twitter-feed clearfix">
<h4>Twitter Feed</h4>
<ul class="iconlist twitter-feed nobottommargin" data-username="envato" data-count="2">
<li></li>
</ul>
</div>
</div>
</div><!-- .footer-widgets-wrap end -->
</div>
<div class="line nomargin"></div>
<!-- Copyrights
============================================= -->
<div id="copyrights" class="" style="background-color: #FFF">
<div class="container clearfix">
<div class="col_full center nomargin">
<span>Copyrights © 2017 All Rights Reserved by Canvas Inc.</span>
</div>
</div>
</div><!-- #copyrights end -->
</footer><!-- #footer end -->
</div><!-- #wrapper end -->
<!-- Go To Top
============================================= -->
<div id="gotoTop" class="icon-angle-up"></div>
<!-- External JavaScripts
============================================= -->
<script src="js/jquery.js"></script>
<script src="js/plugins.js"></script>
<!-- Footer Scripts
============================================= -->
<script src="js/functions.js"></script>
</body>
</html>