sync
[bootswatch] / mPurpose / index.html
1 <!DOCTYPE html>
2 <!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
3 <!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
4 <!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
5 <!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
6     <head>
7         <meta charset="utf-8">
8         <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
9         <title>mPurpose - Multipurpose Feature Rich Bootstrap Template</title>
10         <meta name="description" content="">
11         <meta name="viewport" content="width=device-width">
12
13         <link rel="stylesheet" href="css/bootstrap.min.css">
14         <link rel="stylesheet" href="css/icomoon-social.css">
15         <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700,600,800' rel='stylesheet' type='text/css'>
16
17         <link rel="stylesheet" href="css/leaflet.css" />
18                 <!--[if lte IE 8]>
19                     <link rel="stylesheet" href="css/leaflet.ie.css" />
20                 <![endif]-->
21                 <link rel="stylesheet" href="css/main.css">
22
23         <script src="js/modernizr-2.6.2-respond-1.1.0.min.js"></script>
24     </head>
25     <body>
26         <!--[if lt IE 7]>
27             <p class="chromeframe">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">activate Google Chrome Frame</a> to improve your experience.</p>
28         <![endif]-->
29         
30
31         <!-- Navigation & Logo-->
32         <div class="mainmenu-wrapper">
33                 <div class="container">
34                         <div class="menuextras">
35                                         <div class="extras">
36                                                 <ul>
37                                                         <li class="shopping-cart-items"><i class="glyphicon glyphicon-shopping-cart icon-white"></i> <a href="page-shopping-cart.html"><b>3 items</b></a></li>
38                                                         <li>
39                                                                 <div class="dropdown choose-country">
40                                                                         <a class="#" data-toggle="dropdown" href="#"><img src="img/flags/gb.png" alt="Great Britain"> UK</a>
41                                                                         <ul class="dropdown-menu" role="menu">
42                                                                                 <li role="menuitem"><a href="#"><img src="img/flags/us.png" alt="United States"> US</a></li>
43                                                                                 <li role="menuitem"><a href="#"><img src="img/flags/de.png" alt="Germany"> DE</a></li>
44                                                                                 <li role="menuitem"><a href="#"><img src="img/flags/es.png" alt="Spain"> ES</a></li>
45                                                                         </ul>
46                                                                 </div>
47                                                         </li>
48                                                 <li><a href="page-login.html">Login</a></li>
49                                         </ul>
50                                         </div>
51                         </div>
52                         <nav id="mainmenu" class="mainmenu">
53                                         <ul>
54                                                 <li class="logo-wrapper"><a href="index.html"><img src="img/mPurpose-logo.png" alt="Multipurpose Twitter Bootstrap Template"></a></li>
55                                                 <li class="active">
56                                                         <a href="index.html">Home</a>
57                                                 </li>
58                                                 <li>
59                                                         <a href="features.html">Features</a>
60                                                 </li>
61                                                 <li class="has-submenu">
62                                                         <a href="#">Pages +</a>
63                                                         <div class="mainmenu-submenu">
64                                                                 <div class="mainmenu-submenu-inner"> 
65                                                                         <div>
66                                                                                 <h4>Homepage</h4>
67                                                                                 <ul>
68                                                                                         <li><a href="index.html">Homepage (Sample 1)</a></li>
69                                                                                         <li><a href="page-homepage-sample.html">Homepage (Sample 2)</a></li>
70                                                                                 </ul>
71                                                                                 <h4>Services & Pricing</h4>
72                                                                                 <ul>
73                                                                                         <li><a href="page-services-1-column.html">Services/Features (Rows)</a></li>
74                                                                                         <li><a href="page-services-3-columns.html">Services/Features (3 Columns)</a></li>
75                                                                                         <li><a href="page-services-4-columns.html">Services/Features (4 Columns)</a></li>
76                                                                                         <li><a href="page-pricing.html">Pricing Table</a></li>
77                                                                                 </ul>
78                                                                                 <h4>Team & Open Vacancies</h4>
79                                                                                 <ul>
80                                                                                         <li><a href="page-team.html">Our Team</a></li>
81                                                                                         <li><a href="page-vacancies.html">Open Vacancies (List)</a></li>
82                                                                                         <li><a href="page-job-details.html">Open Vacancies (Job Details)</a></li>
83                                                                                 </ul>
84                                                                         </div>
85                                                                         <div>
86                                                                                 <h4>Our Work (Portfolio)</h4>
87                                                                                 <ul>
88                                                                                         <li><a href="page-portfolio-2-columns-1.html">Portfolio (2 Columns, Option 1)</a></li>
89                                                                                         <li><a href="page-portfolio-2-columns-2.html">Portfolio (2 Columns, Option 2)</a></li>
90                                                                                         <li><a href="page-portfolio-3-columns-1.html">Portfolio (3 Columns, Option 1)</a></li>
91                                                                                         <li><a href="page-portfolio-3-columns-2.html">Portfolio (3 Columns, Option 2)</a></li>
92                                                                                         <li><a href="page-portfolio-item.html">Portfolio Item (Project) Description</a></li>
93                                                                                 </ul>
94                                                                                 <h4>General Pages</h4>
95                                                                                 <ul>
96                                                                                         <li><a href="page-about-us.html">About Us</a></li>
97                                                                                         <li><a href="page-contact-us.html">Contact Us</a></li>
98                                                                                         <li><a href="page-faq.html">Frequently Asked Questions</a></li>
99                                                                                         <li><a href="page-testimonials-clients.html">Testimonials & Clients</a></li>
100                                                                                         <li><a href="page-events.html">Events</a></li>
101                                                                                         <li><a href="page-404.html">404 Page</a></li>
102                                                                                         <li><a href="page-sitemap.html">Sitemap</a></li>
103                                                                                         <li><a href="page-login.html">Login</a></li>
104                                                                                         <li><a href="page-register.html">Register</a></li>
105                                                                                         <li><a href="page-password-reset.html">Password Reset</a></li>
106                                                                                         <li><a href="page-terms-privacy.html">Terms & Privacy</a></li>
107                                                                                         <li><a href="page-coming-soon.html">Coming Soon</a></li>
108                                                                                 </ul>
109                                                                         </div>
110                                                                         <div>
111                                                                                 <h4>eShop</h4>
112                                                                                 <ul>
113                                                                                         <li><a href="page-products-3-columns.html">Products listing (3 Columns)</a></li>
114                                                                                         <li><a href="page-products-4-columns.html">Products listing (4 Columns)</a></li>
115                                                                                         <li><a href="page-products-slider.html">Products Slider</a></li>
116                                                                                         <li><a href="page-product-details.html">Product Details</a></li>
117                                                                                         <li><a href="page-shopping-cart.html">Shopping Cart</a></li>
118                                                                                 </ul>
119                                                                                 <h4>Blog</h4>
120                                                                                 <ul>
121                                                                                         <li><a href="page-blog-posts.html">Blog Posts (List)</a></li>
122                                                                                         <li><a href="page-blog-post-right-sidebar.html">Blog Single Post (Right Sidebar)</a></li>
123                                                                                         <li><a href="page-blog-post-left-sidebar.html">Blog Single Post (Left Sidebar)</a></li>
124                                                                                         <li><a href="page-news.html">Latest & Featured News</a></li>
125                                                                                 </ul>
126                                                                         </div>
127                                                                 </div><!-- /mainmenu-submenu-inner -->
128                                                         </div><!-- /mainmenu-submenu -->
129                                                 </li>
130                                                 <li>
131                                                         <a href="credits.html">Credits</a>
132                                                 </li>
133                                         </ul>
134                                 </nav>
135                         </div>
136                 </div>
137
138         <!-- Homepage Slider -->
139         <div class="homepage-slider">
140                 <div id="sequence">
141                                 <ul class="sequence-canvas">
142                                         <!-- Slide 1 -->
143                                         <li class="bg4">
144                                                 <!-- Slide Title -->
145                                                 <h2 class="title">Responsive</h2>
146                                                 <!-- Slide Text -->
147                                                 <h3 class="subtitle">It looks great on desktops, laptops, tablets and smartphones</h3>
148                                                 <!-- Slide Image -->
149                                                 <img class="slide-img" src="img/homepage-slider/slide1.png" alt="Slide 1" />
150                                         </li>
151                                         <!-- End Slide 1 -->
152                                         <!-- Slide 2 -->
153                                         <li class="bg3">
154                                                 <!-- Slide Title -->
155                                                 <h2 class="title">Color Schemes</h2>
156                                                 <!-- Slide Text -->
157                                                 <h3 class="subtitle">Comes with 5 color schemes and it's easy to make your own!</h3>
158                                                 <!-- Slide Image -->
159                                                 <img class="slide-img" src="img/homepage-slider/slide2.png" alt="Slide 2" />
160                                         </li>
161                                         <!-- End Slide 2 -->
162                                         <!-- Slide 3 -->
163                                         <li class="bg1">
164                                                 <!-- Slide Title -->
165                                                 <h2 class="title">Feature Rich</h2>
166                                                 <!-- Slide Text -->
167                                                 <h3 class="subtitle">Huge amount of components and over 30 sample pages!</h3>
168                                                 <!-- Slide Image -->
169                                                 <img class="slide-img" src="img/homepage-slider/slide3.png" alt="Slide 3" />
170                                         </li>
171                                         <!-- End Slide 3 -->
172                                 </ul>
173                                 <div class="sequence-pagination-wrapper">
174                                         <ul class="sequence-pagination">
175                                                 <li>1</li>
176                                                 <li>2</li>
177                                                 <li>3</li>
178                                         </ul>
179                                 </div>
180                         </div>
181         </div>
182         <!-- End Homepage Slider -->
183
184                 <!-- Press Coverage -->
185         <div class="section">
186                 <div class="container">
187                                 <div class="row">
188                                         <div class="col-md-4 col-sm-6">
189                                                 <div class="in-press press-wired">
190                                                         <a href="#">Morbi eleifend congue elit nec sagittis. Praesent aliquam lobortis tellus, nec consequat vitae</a>
191                                                 </div>
192                                         </div>
193                                         <div class="col-md-4 col-sm-6">
194                                                 <div class="in-press press-mashable">
195                                                         <a href="#">Morbi eleifend congue elit nec sagittis. Praesent aliquam lobortis tellus, nec consequat vitae</a>
196                                                 </div>
197                                         </div>
198                                         <div class="col-md-4 col-sm-6">
199                                                 <div class="in-press press-techcrunch">
200                                                         <a href="#">Morbi eleifend congue elit nec sagittis. Praesent aliquam lobortis tellus, nec consequat vitae</a>
201                                                 </div>
202                                         </div>
203                                 </div>
204                         </div>
205                 </div>
206                 <!-- Press Coverage -->
207
208                 <!-- Services -->
209         <div class="section">
210                 <div class="container">
211                         <div class="row">
212                                 <div class="col-md-4 col-sm-6">
213                                         <div class="service-wrapper">
214                                                 <img src="img/service-icon/diamond.png" alt="Service 1">
215                                                 <h3>Aliquam in adipiscing</h3>
216                                                 <p>Praesent rhoncus mauris ac sollicitudin vehicula. Nam fringilla turpis turpis, at posuere turpis aliquet sit amet condimentum</p>
217                                                 <a href="#" class="btn">Read more</a>
218                                         </div>
219                                 </div>
220                                 <div class="col-md-4 col-sm-6">
221                                         <div class="service-wrapper">
222                                                 <img src="img/service-icon/ruler.png" alt="Service 2">
223                                                 <h3>Curabitur mollis</h3>
224                                                 <p>Suspendisse eget libero mi. Fusce ligula orci, vulputate nec elit ultrices, ornare faucibus orci. Aenean lectus sapien, vehicula</p>
225                                                 <a href="#" class="btn">Read more</a>
226                                         </div>
227                                 </div>
228                                 <div class="col-md-4 col-sm-6">
229                                         <div class="service-wrapper">
230                                                 <img src="img/service-icon/box.png" alt="Service 3">
231                                                 <h3>Vivamus mattis</h3>
232                                                 <p>Phasellus posuere et nisl ac commodo. Nulla facilisi. Sed tincidunt bibendum cursus. Aenean vulputate aliquam risus rutrum scelerisque</p>
233                                                 <a href="#" class="btn">Read more</a>
234                                         </div>
235                                 </div>
236                         </div>
237                 </div>
238             </div>
239             <!-- End Services -->
240
241                 <!-- Call to Action Bar -->
242             <div class="section section-white">
243                         <div class="container">
244                                 <div class="row">
245                                         <div class="col-md-12">
246                                                 <div class="calltoaction-wrapper">
247                                                         <h3>It's a free multipurpose Bootstrap 3 template!</h3> <a href="http://www.dragdropsite.com" class="btn btn-orange">Download here!</a>
248                                                 </div>
249                                         </div>
250                                 </div>
251                         </div>
252                 </div>
253                 <!-- End Call to Action Bar -->
254
255                 <!-- Testimonials -->
256             <div class="section">
257                         <div class="container">
258                                 <h2>Testimonials</h2>
259                                 <div class="row">
260                                         <!-- Testimonial -->
261                                         <div class="testimonial col-md-4 col-sm-6">
262                                                 <!-- Author Photo -->
263                                                 <div class="author-photo">
264                                                         <img src="img/user1.jpg" alt="Author 1">
265                                                 </div>
266                                                 <div class="testimonial-bubble">
267                                                         <blockquote>
268                                                                 <!-- Quote -->
269                                                                 <p class="quote">
270                                             "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut."
271                                         </p>
272                                         <!-- Author Info -->
273                                         <cite class="author-info">
274                                                 - Name Surname,<br>Managing Director at <a href="#">Some Company</a>
275                                         </cite>
276                                 </blockquote>
277                                 <div class="sprite arrow-speech-bubble"></div>
278                         </div>
279                     </div>
280                     <!-- End Testimonial -->
281                     <div class="testimonial col-md-4 col-sm-6">
282                                                 <div class="author-photo">
283                                                         <img src="img/user5.jpg" alt="Author 2">
284                                                 </div>
285                                                 <div class="testimonial-bubble">
286                                                         <blockquote>
287                                                                 <p class="quote">
288                                             "Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo."
289                                         </p>
290                                         <cite class="author-info">
291                                                 - Name Surname,<br>Managing Director at <a href="#">Some Company</a>
292                                         </cite>
293                                 </blockquote>
294                                 <div class="sprite arrow-speech-bubble"></div>
295                         </div>
296                     </div>
297                                         <div class="testimonial col-md-4 col-sm-6">
298                                                 <div class="author-photo">
299                                                         <img src="img/user2.jpg" alt="Author 3">
300                                                 </div>
301                                                 <div class="testimonial-bubble">
302                                                         <blockquote>
303                                                                 <p class="quote">
304                                             "Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur."
305                                         </p>
306                                         <cite class="author-info">
307                                                 - Name Surname,<br>Managing Director at <a href="#">Some Company</a>
308                                         </cite>
309                                 </blockquote>
310                                 <div class="sprite arrow-speech-bubble"></div>
311                         </div>
312                     </div>
313                                 </div>
314                         </div>
315             </div>
316             <!-- End Testimonials -->
317
318                 <!-- Pricing Table -->
319             <div class="section">
320                 <div class="container">
321                         <h2>Pricing</h2>
322                         <div class="row">
323                                 <!-- Pricing Plans Wrapper -->
324                                 <div class="pricing-wrapper col-md-12">
325                                         <!-- Pricing Plan -->
326                                                 <div class="pricing-plan">
327                                                         <!-- Pricing Plan Ribbon -->
328                                                         <div class="ribbon-wrapper">
329                                                                 <div class="price-ribbon ribbon-red">Popular</div>
330                                                         </div>
331                                                         <h2 class="pricing-plan-title">Starter</h2>
332                                                         <p class="pricing-plan-price">FREE</p>
333                                                         <!-- Pricing Plan Features -->
334                                                         <ul class="pricing-plan-features">
335                                                                 <li><strong>1</strong> user</li>
336                                                                 <li><strong>Unlimited</strong> projects</li>
337                                                                 <li><strong>2GB</strong> storage</li>
338                                                         </ul>
339                                                         <a href="index.html" class="btn">Order Now</a>
340                                                 </div>
341                                                 <!-- End Pricing Plan -->
342                                             <div class="pricing-plan">
343                                                         <h2 class="pricing-plan-title">Advanced</h2>
344                                                         <p class="pricing-plan-price">$49<span>/mo</span></p>
345                                                                 <ul class="pricing-plan-features">
346                                                                         <li><strong>10</strong> users</li>
347                                                                         <li><strong>Unlimited</strong> projects</li>
348                                                                         <li><strong>20GB</strong> storage</li>
349                                                                 </ul>
350                                                         <a href="index.html" class="btn">Order Now</a>
351                                             </div>
352                                             <!-- Promoted Pricing Plan -->
353                                             <div class="pricing-plan pricing-plan-promote">
354                                                                 <h2 class="pricing-plan-title">Premium</h2>
355                                                                 <p class="pricing-plan-price">$99<span>/mo</span></p>
356                                                                 <ul class="pricing-plan-features">
357                                                                         <li><strong>Unlimited</strong> users</li>
358                                                                         <li><strong>Unlimited</strong> projects</li>
359                                                                         <li><strong>100GB</strong> storage</li>
360                                                                 </ul>
361                                                         <a href="index.html" class="btn">Order Now</a>
362                                             </div>
363                                             <div class="pricing-plan">
364                                                 <!-- Pricing Plan Ribbon -->
365                                                         <div class="ribbon-wrapper">
366                                                                 <div class="price-ribbon ribbon-green">New</div>
367                                                         </div>
368                                                         <h2 class="pricing-plan-title">Mega</h2>
369                                                         <p class="pricing-plan-price">$199<span>/mo</span></p>
370                                                                 <ul class="pricing-plan-features">
371                                                                         <li><strong>Unlimited</strong> users</li>
372                                                                         <li><strong>Unlimited</strong> projects</li>
373                                                                         <li><strong>100GB</strong> storage</li>
374                                                                 </ul>
375                                                         <a href="index.html" class="btn">Order Now</a>
376                                             </div>
377                                 </div>
378                                 <!-- End Pricing Plans Wrapper -->
379                         </div>
380                 </div>
381             </div>
382             <!-- End Pricing Table -->
383
384                 <!-- Our Clients -->
385             <div class="section">
386                 <div class="container">
387                         <h2>Our Clients</h2>
388                                 <div class="clients-logo-wrapper text-center row">
389                                         <div class="col-lg-1 col-md-1 col-sm-3 col-xs-6"><a href="#"><img src="img/logos/canon.png" alt="Client Name"></a></div>
390                                         <div class="col-lg-1 col-md-1 col-sm-3 col-xs-6"><a href="#"><img src="img/logos/cisco.png" alt="Client Name"></a></div>
391                                         <div class="col-lg-1 col-md-1 col-sm-3 col-xs-6"><a href="#"><img src="img/logos/dell.png" alt="Client Name"></a></div>
392                                         <div class="col-lg-1 col-md-1 col-sm-3 col-xs-6"><a href="#"><img src="img/logos/ea.png" alt="Client Name"></a></div>
393                                         <div class="col-lg-1 col-md-1 col-sm-3 col-xs-6"><a href="#"><img src="img/logos/ebay.png" alt="Client Name"></a></div>
394                                         <div class="col-lg-1 col-md-1 col-sm-3 col-xs-6"><a href="#"><img src="img/logos/facebook.png" alt="Client Name"></a></div>
395                                         <div class="col-lg-1 col-md-1 col-sm-3 col-xs-6"><a href="#"><img src="img/logos/google.png" alt="Client Name"></a></div>
396                                         <div class="col-lg-1 col-md-1 col-sm-3 col-xs-6"><a href="#"><img src="img/logos/hp.png" alt="Client Name"></a></div>
397                                         <div class="col-lg-1 col-md-1 col-sm-3 col-xs-6"><a href="#"><img src="img/logos/microsoft.png" alt="Client Name"></a></div>
398                                         <div class="col-lg-1 col-md-1 col-sm-3 col-xs-6"><a href="#"><img src="img/logos/mysql.png" alt="Client Name"></a></div>
399                                         <div class="col-lg-1 col-md-1 col-sm-3 col-xs-6"><a href="#"><img src="img/logos/sony.png" alt="Client Name"></a></div>
400                                         <div class="col-lg-1 col-md-1 col-sm-3 col-xs-6"><a href="#"><img src="img/logos/yahoo.png" alt="Client Name"></a></div>
401                                 </div>
402                         </div>
403             </div>
404             <!-- End Our Clients -->
405
406             <!-- Footer -->
407             <div class="footer">
408                 <div class="container">
409                         <div class="row">
410                                 <div class="col-footer col-md-3 col-xs-6">
411                                         <h3>Our Latest Work</h3>
412                                         <div class="portfolio-item">
413                                                         <div class="portfolio-image">
414                                                                 <a href="page-portfolio-item.html"><img src="img/portfolio6.jpg" alt="Project Name"></a>
415                                                         </div>
416                                                 </div>
417                                 </div>
418                                 <div class="col-footer col-md-3 col-xs-6">
419                                         <h3>Navigate</h3>
420                                         <ul class="no-list-style footer-navigate-section">
421                                                 <li><a href="page-blog-posts.html">Blog</a></li>
422                                                 <li><a href="page-portfolio-3-columns-2.html">Portfolio</a></li>
423                                                 <li><a href="page-products-3-columns.html">eShop</a></li>
424                                                 <li><a href="page-services-3-columns.html">Services</a></li>
425                                                 <li><a href="page-pricing.html">Pricing</a></li>
426                                                 <li><a href="page-faq.html">FAQ</a></li>
427                                         </ul>
428                                 </div>
429                                 
430                                 <div class="col-footer col-md-4 col-xs-6">
431                                         <h3>Contacts</h3>
432                                         <p class="contact-us-details">
433                                                 <b>Address:</b> 123 Fake Street, LN1 2ST, London, United Kingdom<br/>
434                                                 <b>Phone:</b> +44 123 654321<br/>
435                                                 <b>Fax:</b> +44 123 654321<br/>
436                                                 <b>Email:</b> <a href="mailto:getintoutch@yourcompanydomain.com">getintoutch@yourcompanydomain.com</a>
437                                         </p>
438                                 </div>
439                                 <div class="col-footer col-md-2 col-xs-6">
440                                         <h3>Stay Connected</h3>
441                                         <ul class="footer-stay-connected no-list-style">
442                                                 <li><a href="#" class="facebook"></a></li>
443                                                 <li><a href="#" class="twitter"></a></li>
444                                                 <li><a href="#" class="googleplus"></a></li>
445                                         </ul>
446                                 </div>
447                         </div>
448                         <div class="row">
449                                 <div class="col-md-12">
450                                         <div class="footer-copyright">&copy; 2013 mPurpose. All rights reserved.</div>
451                                 </div>
452                         </div>
453                     </div>
454             </div>
455
456         <!-- Javascripts -->
457         <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
458         <script>window.jQuery || document.write('<script src="js/jquery-1.9.1.min.js"><\/script>')</script>
459         <script src="js/bootstrap.min.js"></script>
460         <script src="http://cdn.leafletjs.com/leaflet-0.5.1/leaflet.js"></script>
461         <script src="js/jquery.fitvids.js"></script>
462         <script src="js/jquery.sequence-min.js"></script>
463         <script src="js/jquery.bxslider.js"></script>
464         <script src="js/main-menu.js"></script>
465         <script src="js/template.js"></script>
466
467     </body>
468 </html>