<!DOCTYPE html> <html lang="en"> <head> <meta name="description" content=""> <meta name="keywords" content=""> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width"> <title>Brand Name</title> <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700,300' rel='stylesheet' type='text/css'> <link href="./public/css/animate.min.css" rel="stylesheet"> <link href="./public/css/slick.css" rel="stylesheet"> <link href="./public/css/main.css" rel="stylesheet"> </head> <body> <div class="wrapper"> <div class="home-page"> <div class="main-content"> <div class="align-box"> <div class="container"> <h1 class="logo animation-box"><a href="./index.html"><img src="./public/images/logotype.png" alt="Brand Name"></a></h1> <div class="animation-box title-group"> <h3>Vestibulum Ante Ipsum</h3> <h4>Fusce ut sodales ligula</h4> </div> <ul class="list-box"> <li class="animation-box"> </li> <li class="animation-box"> </li> <li class="animation-box"> </li> </ul> <div class="text-box home animation-box"> <h5>Aliquam vehicula sollicitudin turpis, eu sagittis nibh blandit ac.</h5> <p>Integer nisl ipsum, lobortis non pellentesque non, congue in nisl. Pellentesque id nisl tempus, aliquam orci at.</p> <a href="#" class="sign-up-now-btn">Sign Up now</a> </div> </div> </div> </div> </div> <div class="about-page"> <div class="main-content"> <div class="align-box"> <div class="container"> <h2 class="border-title animation-box"><span>About</span></h2> <div class="about-box animation-box clearfix"> <div class="wrap-img"><img src="./public/images/pictures/img-1.jpg" alt="Picture"></div> <div class="text-box"> <h3>Nulla vel magna facilisis, placerat dui non, tempus habitant tristique senectus.</h3> <p>Donec consectetur dapibus metus, ut scelerisque purus vestibulum sit amet. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Quisque nec risus finibus, lobortis dui eget, volutpat nulla. Sed vel elementum nibh. Interdum et malesuada fames ac ante ipsum primis in faucibus. Suspendisse potenti.</p> </div> </div> <div class="group-links"> <div class="animation-box"> <a href="#"> <strong>Vestibulum ante</strong> <span>ex pharetra bibendum</span> </a> </div> <div class="animation-box"> <a href="#"> <strong>Proin eu sodales</strong> <span>vel finibus dolor</span> </a> </div> <div class="animation-box"> <a href="#"> <strong>Suspendisse risus</strong> <span>Nullam volutpat sed</span> </a> </div> </div> </div> </div> </div> </div> <div class="portfolio-page"> <div class="main-content"> <div class="align-box"> <div class="container"> <h2 class="border-title animation-box"><span>Portfolio</span></h2> <p class="animation-box portfolio-par">Donec consectetur dapibus metus, ut scelerisque purus vestibulum sit amet. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia sed interdum mi consectetur.</p> <div class="portfolio-slider"> <div> <div class="wrap-box"> <div class="box"> <div class="animation-box"><a href="#"><img src="./public/images/pictures/prtl-img-1.jpg" alt="picture"></a></div> <div class="animation-box"><a href="#"><img src="./public/images/pictures/prtl-img-2.jpg" alt="picture"></a></div> <div class="animation-box"><a href="#"><img src="./public/images/pictures/prtl-img-3.jpg" alt="picture"></a></div> <div class="animation-box"><a href="#"><img src="./public/images/pictures/prtl-img-4.jpg" alt="picture"></a></div> <div class="animation-box"><a href="#"><img src="./public/images/pictures/prtl-img-5.jpg" alt="picture"></a></div> <div class="animation-box"><a href="#"><img src="./public/images/pictures/prtl-img-6.jpg" alt="picture"></a></div> <div class="animation-box"><a href="#"><img src="./public/images/pictures/prtl-img-7.jpg" alt="picture"></a></div> <div class="animation-box"><a href="#"><img src="./public/images/pictures/prtl-img-8.jpg" alt="picture"></a></div> <div class="animation-box"><a href="#"><img src="./public/images/pictures/prtl-img-9.jpg" alt="picture"></a></div> <div class="animation-box"><a href="#"><img src="./public/images/pictures/prtl-img-10.jpg" alt="picture"></a></div> </div> </div> </div> <div> <div class="wrap-box"> <div class="box"> <div class="animation-box"><a href="#"><img src="./public/images/pictures/prtl-img-10.jpg" alt="picture"></a></div> <div class="animation-box"><a href="#"><img src="./public/images/pictures/prtl-img-9.jpg" alt="picture"></a></div> <div class="animation-box"><a href="#"><img src="./public/images/pictures/prtl-img-8.jpg" alt="picture"></a></div> <div class="animation-box"><a href="#"><img src="./public/images/pictures/prtl-img-7.jpg" alt="picture"></a></div> <div class="animation-box"><a href="#"><img src="./public/images/pictures/prtl-img-6.jpg" alt="picture"></a></div> <div class="animation-box"><a href="#"><img src="./public/images/pictures/prtl-img-5.jpg" alt="picture"></a></div> <div class="animation-box"><a href="#"><img src="./public/images/pictures/prtl-img-4.jpg" alt="picture"></a></div> <div class="animation-box"><a href="#"><img src="./public/images/pictures/prtl-img-3.jpg" alt="picture"></a></div> <div class="animation-box"><a href="#"><img src="./public/images/pictures/prtl-img-2.jpg" alt="picture"></a></div> <div class="animation-box"><a href="#"><img src="./public/images/pictures/prtl-img-1.jpg" alt="picture"></a></div> </div> </div> </div> </div> </div> </div> </div> </div> <div class="blog-page"> <div class="main-content"> <div class="align-box"> <div class="container"> <h2 class="border-title animation-box"><span>Blog</span></h2> <div class="blog-slider"> <div> <div class="box animation-box clearfix"> <a href="#" class="wrap-img"><img src="./public/images/pictures/blg-img-1.jpg" alt="picture"></a> <div class="text-box"> <h3><a href="#">Vestibulum ac tincidunt massa</a></h3> <h4>18 Feb, 2015</h4> <div class="read-more-btn"><a href="#">Read More</a></div> </div> </div> <div class="box animation-box clearfix"> <a href="#" class="wrap-img"><img src="./public/images/pictures/blg-img-2.jpg" alt="picture"></a> <div class="text-box"> <h3><a href="#">Nulla vel magna facilisis ut</a></h3> <h4>17 Feb, 2015</h4> <div class="read-more-btn"><a href="#">Read More</a></div> </div> </div> <div class="box animation-box clearfix"> <a href="#" class="wrap-img"><img src="./public/images/pictures/blg-img-3.jpg" alt="picture"></a> <div class="text-box"> <h3><a href="#">Maecenas molestie turpis et dolor</a></h3> <h4>15 Feb, 2015</h4> <div class="read-more-btn"><a href="#">Read More</a></div> </div> </div> </div> <div> <div class="box clearfix"> <a href="#" class="wrap-img"><img src="./public/images/pictures/blg-img-3.jpg" alt="picture"></a> <div class="text-box"> <h3><a href="#">Vestibulum ac tincidunt massa</a></h3> <h4>18 Feb, 2015</h4> <div class="read-more-btn"><a href="#">Read More</a></div> </div> </div> <div class="box clearfix"> <a href="#" class="wrap-img"><img src="./public/images/pictures/blg-img-1.jpg" alt="picture"></a> <div class="text-box"> <h3><a href="#">Nulla vel magna facilisis ut</a></h3> <h4>17 Feb, 2015</h4> <div class="read-more-btn"><a href="#">Read More</a></div> </div> </div> <div class="box clearfix"> <a href="#" class="wrap-img"><img src="./public/images/pictures/blg-img-2.jpg" alt="picture"></a> <div class="text-box"> <h3><a href="#">Maecenas molestie turpis et dolor</a></h3> <h4>15 Feb, 2015</h4> <div class="read-more-btn"><a href="#">Read More</a></div> </div> </div> </div> </div> </div> </div> </div> </div> <div class="contact-page"> <div class="main-content"> <div class="align-box"> <div class="container"> <h2 class="border-title animation-box"><span>Contact</span></h2> <p class="contact-par animation-box">Donec consectetur dapibus metus, ut scelerisque purus vestibulum sit amet. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia sed interdum mi consectetur.</p> <div class="map-area animation-box"> <iframe src="https://www.google.com/maps/embed?pb=!1m16!1m8!1m3!1d3056.750271103107!2d-83.03080844527885!3d39.99168580976378!3m2!1i1024!2i768!4f13.1!4m5!1i0!3e6!4m0!4m1!2s8901+Marmora+Road%2C+Glasgow%2C+D04+89GR!5e0!3m2!1sru!2sua!4v1424688197509"></iframe> </div> <div class="contact-box"> <div class="box animation-box"> 8901 Marmora Road,<br> Glasgow, D04 89GR </div> <div class="box animation-box"> 1 800 123 4567<br> 1 800 234 5678 </div> <div class="box animation-box"> <a href="mailto:info@example.com">info@example.com</a><br> <a href="mailto:brand@example.com">brand@example.com</a> </div> </div> <div class="write-letter-btn animation-box"><a href="#">Click Here to write us a letter</a></div> </div> </div> </div> </div> </div> <script type="text/javascript" src="./public/js/jquery.js"></script> <script type="text/javascript" src="./public/js/slick.min.js"></script> <script type="text/javascript" src="./public/js/main.js"></script> </body> </html>