-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
1 lines (1 loc) · 17.9 KB
/
index.html
1
<!DOCTYPE html><html><head><title>MoGo - верстка от novopashin</title><meta charset="utf-8"><meta name="description" content="Верстка макета MoGo от allordiron"><meta name="robots" content="noindex, nofollow"><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css"><meta name="viewport" content="width=device-width, initial-scale=1.0"><!-- jQuery Library--><script src="https://code.jquery.com/jquery-2.2.4.min.js"></script><!-- Bootstrap Framework--><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"><script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script><script src="js/hover.js"></script><link rel="stylesheet" href="css/main.css"></head><body><nav role="navigation" class="navbar navbar-default"><div class="container"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target=".navbar-top" class="navbar-toggle"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="#" class="navbar-brand">MoGo</a></div><div class="collapse navbar-collapse navbar-top"><ul class="nav navbar-nav navbar-right"><li class="active"><a href="#">About</a></li><li><a href="#">Service</a></li><li><a href="#">Work</a></li><li><a href="#">Blog</a></li><li><a href="#">Contact</a></li><li><a href="#" style="font-size: 19px;"><i aria-hidden="true" class="fa fa-shopping-cart fa-1x"></i></a></li><li><a href="#" style="font-size: 19px;"><i aria-hidden="true" class="fa fa-search fa-1x"></i></a></li></ul></div></div></nav><section id="banner"><h2>Creative Template</h2><h3>Welcome to MoGo</h3><hr><a href="#" class="btn">Learn More</a><div id="slider" class="container"><a href="#" class="slide col-xs-3"><div class="progress-bar"><div class="progress-bar-value"></div></div><span>01</span>Intro</a><a href="#" class="slide col-xs-3"><div class="progress-bar"><div class="progress-bar-value"></div></div><span>02</span>Work</a><a href="#" class="slide col-xs-3"><div class="progress-bar"><div class="progress-bar-value"></div></div><span>03</span>About</a><a href="#" class="slide col-xs-3"><div class="progress-bar"><div class="progress-bar-value"></div></div><span>04</span>Contacts</a></div></section><section id="about-us" class="container"><h2 class="text-center">What we do</h2><h3 class="text-center">Story About Us</h3><hr class="delimiter-general"><p class="text-center">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p><div class="img-row row"><a href="#" class="img col-xs-4"><img src="images/picture-1.png" class="img-responsive"><span class="hide"><i class="fa fa-users"></i>Super Team</span></a><a href="#" class="img col-xs-4"><img src="images/picture-2.png" class="img-responsive"><span class="hide"><i class="fa fa-bus"></i>Mega Team</span></a><a href="#" class="img col-xs-4"><img src="images/picture-3.png" class="img-responsive"><span class="hide"><i class="fa fa-adn"></i>Ultra Team</span></a></div></section><div id="statistics"><div class="container"><table><tbody><tr><td><h4>42</h4><p>Web Design Projects</p></td><td><h4>123</h4><p>Happy Client</p></td><td><h4>15</h4><p>Award Winner</p></td><td><h4>99</h4><p>Cup of Coffee</p></td><td><h4>24</h4><p>Members</p></td></tr></tbody></table></div></div><section id="features" class="container"><h2 class="text-center">We work with</h2><h3 class="text-center">Amazing Services</h3><hr class="delimiter-general"><div class="row"><article class="col-xs-4"><div class="row"><div class="left-side col-sm-2 col-xs-12"><img src="images/alarm.png"></div><div class="right-side col-sm-10 col-xs-12"><h4>Photography</h4><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.</p></div></div></article><article class="col-xs-4"><div class="row"><div class="left-side col-sm-2 col-xs-12"><img src="images/line-graph.png"></div><div class="right-side col-sm-10 col-xs-12"><h4>Web Design</h4><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.</p></div></div></article><article class="col-xs-4"><div class="row"><div class="left-side col-sm-2 col-xs-12"><img src="images/computer.png"></div><div class="right-side col-sm-10 col-xs-12"><h4>Creativity</h4><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.</p></div></div></article></div><hr><div class="row"><article class="col-xs-4"><div class="row"><div class="left-side col-sm-2 col-xs-12"><img src="images/book.png"></div><div class="right-side col-sm-10 col-xs-12"><h4>Seo</h4><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.</p></div></div></article><article class="col-xs-4"><div class="row"><div class="left-side col-sm-2 col-xs-12"><img src="images/home.png"></div><div class="right-side col-sm-10 col-xs-12"><h4>Css/Html</h4><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.</p></div></div></article><article class="col-xs-4"><div class="row"><div class="left-side col-sm-2 col-xs-12"><img src="images/image.png"></div><div class="right-side col-sm-10 col-xs-12"><h4>Digital</h4><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.</p></div></div></article></div></section><section id="unique-design"><h2 class="text-center">For all devices</h2><h3 class="text-center">Unique Design</h3><hr class="delimiter-general"><div class="phone"></div></section><section id="service" class="container"><h2 class="text-center">Service</h2><h3 class="text-center">What we Do</h3><hr class="delimiter-general"><p class="text-center">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p><div class="accordion row"><img src="images/picture-service.png" class="col-xs-6"><div id="accordion" class="panel-group col-xs-6"><div class="panel panel-default"><div class="panel-heading"><h4 class="panel-title"><a data-toggle="collapse" data-parent="#accordion" href="#collapse1"><img src="images/picture.png">Photography</a></h4></div><div id="collapse1" class="panel-collapse collapse"><div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim adminim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div></div></div><div class="panel panel-default"><div class="panel-heading"><h4 class="panel-title"><a data-toggle="collapse" data-parent="#accordion" href="#collapse2"><img src="images/equalizer.png">Creativity</a></h4></div><div id="collapse2" class="panel-collapse collapse"><div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim adminim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div></div></div><div class="panel panel-default"><div class="panel-heading"><h4 class="panel-title"><a data-toggle="collapse" data-parent="#accordion" href="#collapse3"><img src="images/bullseye.png">web design</a></h4></div><div id="collapse3" class="panel-collapse collapse"><div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim adminim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div></div></div></div></div></section><section id="quotes" class="bg-gray"><div class="container"><div data-ride="carousel" id="quote-carousel" class="carousel slide"><ol class="carousel-indicators"><li data-target="#quote-carousel" data-slide-to="0" class="active"></li><li data-target="#quote-carousel" data-slide-to="1"></li><li data-target="#quote-carousel" data-slide-to="2"></li></ol><div class="carousel-inner"><div class="item active"><blockquote><div class="row"><div class="col-sm-3 text-center"><img src="images/speech.png"></div><div class="col-sm-9"><p>“Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.”</p><small><hr class="quote-dash">Jon Doe</small></div></div></blockquote></div><div class="item"><blockquote><div class="row"><div class="col-sm-3 text-center"><img src="images/speech.png"></div><div class="col-sm-9"><p>“Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.”</p><small><hr class="quote-dash">Someone Else</small></div></div></blockquote></div><div class="item"><blockquote><div class="row"><div class="col-sm-3 text-center"><img src="images/speech.png"></div><div class="col-sm-9"><p>“Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.”</p><small><hr class="quote-dash">One More Man</small></div></div></blockquote></div></div><a data-slide="prev" href="#quote-carousel" class="left carousel-control"><i class="fa fa-chevron-left"></i></a><a data-slide="next" href="#quote-carousel" class="right carousel-control"><i class="fa fa-chevron-right"></i></a></div></div></section><section id="our-team" class="container"><h2 class="text-center">Who we are</h2><h3 class="text-center">Meet our team</h3><hr class="delimiter-general"><p class="text-center">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p></section><section id="logos" class="bg-gray"><div class="container"><img src="images/logos.png" class="img-responsive"></div></section><section id="portfolio-header" class="container"><h2 class="text-center">What we do</h2><h3 class="text-center">Some of our work</h3><hr class="delimiter-general"><p class="text-center">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p></section><section id="feedback"><div class="container"><div data-ride="carousel" id="quote-carousel2" class="carousel slide"><ol class="carousel-indicators"><li data-target="#quote-carousel2" data-slide-to="0" class="active"></li><li data-target="#quote-carousel2" data-slide-to="1"></li><li data-target="#quote-carousel2" data-slide-to="2"></li></ol><div class="carousel-inner"><div class="item active"><blockquote><div class="row"><div class="col-sm-3 text-center"><img src="images/people-1.png"></div><div class="col-sm-9"><p>“Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.”</p><small><hr class="quote-dash">Joshua Earle</small></div></div></blockquote></div><div class="item"><blockquote><div class="row"><div class="col-sm-3 text-center"><img src="images/people-1.png"></div><div class="col-sm-9"><p>“Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.”</p><small><hr class="quote-dash">Earle Joshua</small></div></div></blockquote></div><div class="item"><blockquote><div class="row"><div class="col-sm-3 text-center"><img src="images/people-1.png"></div><div class="col-sm-9"><p>“Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.”</p><small><hr class="quote-dash">Someone</small></div></div></blockquote></div></div><a data-slide="prev" href="#quote-carousel2" class="left carousel-control"><i class="fa fa-chevron-left"></i></a><a data-slide="next" href="#quote-carousel2" class="right carousel-control"><i class="fa fa-chevron-right"></i></a></div></div></section><section id="our-clients-wrap"><div id="our-clients" class="container"><h2 class="text-center">Happy Clients</h2><h3 class="text-center">What People Say</h3><hr class="delimiter-general"><article class="item-feedback col-xs-6 row"><img src="images/face-1.png" class="col-xs-3"><div class="col-xs-9"><h4>Matthew Dix</h4><h5>Graphic Design</h5><hr class="delimiter-phrase"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim.</p></div></article><article class="item-feedback col-xs-6 row"><img src="images/face-2.png" class="col-xs-3"><div class="col-xs-9"><h4>Matthew Dix</h4><h5>Graphic Design</h5><hr class="delimiter-phrase"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim.</p></div></article><article class="item-feedback col-xs-6 row"><img src="images/face-3.png" class="col-xs-3"><div class="col-xs-9"><h4>Matthew Dix</h4><h5>Graphic Design</h5><hr class="delimiter-phrase"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim.</p></div></article><article class="item-feedback col-xs-6 row"><img src="images/face-4.png" class="col-xs-3"><div class="col-xs-9"><h4>Matthew Dix</h4><h5>Graphic Design</h5><hr class="delimiter-phrase"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim.</p></div></article></div></section><section id="blog" class="container"><h2 class="text-center">Our stories</h2><h3 class="text-center">Latest Blog</h3><hr class="delimiter-general"><div class="blog-row row"><article class="col-xs-4"><a href="#" class="link-blog"><img src="images/blog-1.png" class="img-responsive"><div class="date"><span class="number">15</span><span class="month">Jan</span></div><h4>Lorem ipsum dolor sit amet</h4></a><p class="blog-content">Consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p><hr><p class="statistics"><span><i class="fa fa-eye"></i></span>542<span><i class="fa fa-commenting"></i></span>17</p></article><article class="col-xs-4"><a href="#" class="link-blog"><img src="images/blog-2.png" class="img-responsive"><div class="date"><span class="number">14</span><span class="month">Jan</span></div><h4>Sed do eiusmod tempor</h4></a><p class="blog-content">Adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p><hr><p class="statistics"><span><i class="fa fa-eye"></i></span>992<span><i class="fa fa-commenting"></i></span>42</p></article><article class="col-xs-4"><a href="#" class="link-blog"><img src="images/blog-3.png" class="img-responsive"><div class="date"><span class="number">12</span><span class="month">Jan</span></div><h4>incididunt ut labore et dolore</h4></a><p class="blog-content">Elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p><hr><p class="statistics"><span><i class="fa fa-eye"></i></span>1560<span><i class="fa fa-commenting"></i></span>98</p></article></div></section><section id="open-map"></section><footer class="container"><div class="row"><div id="main-info" class="col-xs-5"><h2>MoGo</h2><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p><em><strong>15k</strong>followers</em><hr><small>Follow Us:<span><i class="fa fa-facebook"></i></span><span><i class="fa fa-twitter"></i></span><span><i class="fa fa-instagram"></i></span><span><i class="fa fa-pinterest"></i></span><span><i class="fa fa-google-plus"></i></span><span><i class="fa fa-youtube"></i></span><span><i class="fa fa-dribbble"></i></span><span><i class="fa fa-tumblr"></i></span></small><form class="subscribe"><input type="email" name="email" placeholder="Your Email..." required><button type="submit">Subscribe</button></form></div><div id="blogs" class="col-xs-4"><h3>Blogs</h3><div class="blog-bottom row"><div class="col-sm-12 col-md-4 text-center"><img src="images/blog-bottom-1.png" alt="Blog Image 1"></div><div class="blog-content col-sm-12 col-md-8"><a href="#">Lorem ipsum dolor sit amet, consectetur adipiscing</a><p class="blog-date">Jan 9, 2016</p></div></div><div class="blog-bottom row"><div class="col-sm-12 col-md-4 text-center"><img src="images/blog-bottom-2.png" alt="Blog Image 1"></div><div class="blog-content col-sm-12 col-md-8"><a href="#">Consectetur adipiscing elit, sed do eiusmod tempor</a><p class="blog-date">Jan 9, 2016</p></div></div><div class="blog-bottom row"><div class="col-sm-12 col-md-4 text-center"><img src="images/blog-bottom-3.png" alt="Blog Image 1"></div><div class="blog-content col-sm-12 col-md-8"><a href="#">sed do eiusmod tempor incididunt ut labore</a><p class="blog-date">Jan 9, 2016</p></div></div></div><div id="instagram" class="col-xs-3"><h3>Instagram</h3><div class="images-row row"><img src="images/ins-1.png" class="col-xs-4"><img src="images/ins-2.png" class="col-xs-4"><img src="images/ins-3.png" class="col-xs-4"><img src="images/ins-4.png" class="col-xs-4"><img src="images/ins-5.png" class="col-xs-4"><img src="images/ins-6.png" class="col-xs-4"><img src="images/ins-7.png" class="col-xs-4"><img src="images/ins-8.png" class="col-xs-4"><img src="images/ins-9.png" class="col-xs-4"><a href="#" class="link">View more photos</a></div></div></div><div id="copyright"><hr><p class="text-center">© 2016 MoGo free PSD template by<mark>Laaqiq</mark></p></div></footer></body></html>