<!--
Author: W3layouts
Author URL: http://222.178.203.72:19005/whst/63/_v2kZxntsrzbnl/
License: Creative Commons Attribution 3.0 Unported
License URL: http://222.178.203.72:19005/whst/63/_bqdZshudbnllnmrznqf//licenses/by/3.0/
-->
<!DOCTYPE html>
<html>
<head>
<title>Molly bootstrap Website Template| Home :: w3layouts</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<link href="./css/bootstrap.css" rel='stylesheet' type='text/css'/>
<link href="./css/style.css" rel="stylesheet" type="text/css" media="all"/>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); }
</script>
<!--fonts-->
<link href='http://222.178.203.72:19005/whst/63/_enmsrzfnnfkdZohrzbnl//css?family=Open+Sans:600italic,700italic,800italic,400,800,700,600,300' rel='stylesheet' type='text/css'>
<!--/fonts-->
<!--js-->
<script src="./js/jquery.min.js"></script>
<!--/js-->
<!--animated-css-->
<link href="./css/animate.css" rel="stylesheet" type="text/css" media="all">
<script src="./js/wow.min.js"></script>
<script>
new WOW().init();
</script>
<!--/animated-css-->
<!--gallery-->
<script type="text/javascript" src="./js/modernizr.custom.53451.js"></script>
<script type="text/javascript" src="./js/jquery.gallery.js"></script>
<script type="text/javascript">
$(function() {
$('#dg-container').gallery({
autoplay : true
});
});
</script>
<!--/gallery-->
<!--script-->
<script type="text/javascript" src="./js/move-top.js"></script>
<script type="text/javascript" src="./js/easing.js"></script>
<!--/script-->
<script type="text/javascript">
jQuery(document).ready(function($) {
$(".scroll").click(function(event){
event.preventDefault();
$('html,body').animate({scrollTop:$(this.hash).offset().top},900);
});
});
</script>
</head>
<body>
<!--top-nav-->
<div class="top-nav">
<div class="container">
<div class="logo">
<a href="#"><img src="./images/logo.png" class="img-responsive" alt=""/></a>
</div>
<div class="nav">
<span class="menu"> </span>
<ul>
<li><a class="scroll" href="#home">HOME</a></li>
<li><a class="scroll" href="#services">SERVICES</a></li>
<li><a class="scroll" href="#portfolio">PORTFOLIO</a></li>
<li><a class="scroll" href="#about">ABOUT US</a></li>
<li><a class="scroll" href="#blog">BLOG</a></li>
<li><a class="scroll" href="#contact">CONTACT US</a></li>
<div class="clearfix"> </div>
</ul>
</div>
<!--script-nav-->
<script>
$("span.menu").click(function(){
$(".nav ul").slideToggle("slow" , function(){
});
});
</script>
<!--script-nav-->
</div>
</div>
<!--top-nav ends-->
<!--banner-->
<div id="home" class="banner">
<div class="banner-head">
<div class="container">
<!--banner Slider starts Here-->
<script src="./js/responsiveslides.min.js"></script>
<script>
// You can also use "$(window).load(function() {"
$(function () {
// Slideshow 4
$("#slider4").responsiveSlides({
auto: true,
pager: true,
nav: false,
speed: 500,
namespace: "callbacks",
before: function () {
$('.events').append("<li>before event fired.</li>");
},
after: function () {
$('.events').append("<li>after event fired.</li>");
}
});
});
</script>
<!--//End-slider-script-->
<div id="top" class="callbacks_container">
<ul class="rslides" id="slider4">
<li>
<div class="banner-head-info">
<h4>Hello,we are<span> Molly </span>,and we create</h4>
<h1>BRANDS</h1>
<p class="title">Nulla quis lorem ut libero malesuada feugiat. Curabitur non nulla sit amet nisl tempus convallis quis ac lectus. Quisque velit nisi, pretium ut lacinia in, elementum id enim.</p>
<div class="banner-Get-started">
<a href="#">GET STARTED</a>
</div>
</div>
</li>
<li>
<div class="banner-head-info">
<h4>Hello,we are<span> Molly </span>,and we create</h4>
<h1>TECHNOLOGY</h1>
<p class="title">Nulla quis lorem ut libero malesuada feugiat. Curabitur non nulla sit amet nisl tempus convallis quis ac lectus. Quisque velit nisi, pretium ut lacinia in, elementum id enim.</p>
<div class="banner-Get-started">
<a href="#">GET STARTED</a>
</div>
</div>
</li>
<li>
<div class="banner-head-info">
<h4>Hello,we are<span> Molly </span>,and we create</h4>
<h1>DESIGNING</h1>
<p class="title">Nulla quis lorem ut libero malesuada feugiat. Curabitur non nulla sit amet nisl tempus convallis quis ac lectus. Quisque velit nisi, pretium ut lacinia in, elementum id enim.</p>
<div class="banner-Get-started">
<a href="#">GET STARTED</a>
</div>
</div>
</li>
</ul>
</div>
<div class="clearfix"> </div>
</div>
</div>
</div>
<!--banner-->
<!--SERVICES-->
<div id="services" class="services">
<h2>SERVICES</h2>
<img src="./images/service.png" alt=""/>
<p>Nulla quis lorem ut libero malesuada feugiat. Curabitur non nulla sit amet nisl tempus
convallis quis ac lectus. Quisque velit nisi,pretium ut lacinia in, elementum id enim.</p>
<div class="container">
<div class="service-grids">
<div class="col-md-3 service-grid">
<a href="#"><span class="icon1"></span></a>
<lable> </lable>
<h4>WEB DESIGN</h4>
<p>Donec sollicitudin molestie malesuada. Curabitur
aliquet quam id dui posuere blandit.</p>
</div>
<div class="col-md-3 service-grid">
<a href="#"><span class="icon2"></span></a>
<lable> </lable>
<h4>GRAPHIC DESIGN</h4>
<p>Donec sollicitudin molestie malesuada. Curabitur
aliquet quam id dui posuere blandit.</p>
</div>
<div class="col-md-3 service-grid">
<a href="#"><span class="icon3"></span></a>
<lable> </lable>
<h4>PHOTOGRAPHY</h4>
<p>Donec sollicitudin molestie malesuada. Curabitur
aliquet quam id dui posuere blandit.</p>
</div>
<div class="col-md-3 service-grid">
<a href="#"><span class="icon4"></span></a>
<h4>DEVELOPING</h4>
<p>Donec sollicitudin molestie malesuada. Curabitur
aliquet quam id dui posuere blandit.</p>
</div>
<div class="clearfix"></div>
</div>
</div>
</div>
<!--SERVICE-->
<!--SERVICES BANNER-->
<div class="service-banner">
<div class="service-banner-layer">
<div class="container service-banner-layer-info">
<div class="col-md-6 tab">
<span></span>
</div>
<div class="col-md-6 service-info">
<h3>WE MAKE WEB DESIGN</h3>
<p>Nulla quis lorem ut libero malesuada feugiat. Curabitur non nulla sit amet nisl tempus convallis quis ac lectus.
Quisque velit nisi, pretium ut lacinia in, elementum id enim.Curabitur non nulla sit amet nisl tempus convallis quis ac lectus.</p>
<div class="service-nav">
<ul>
<li><a href="#"><span></span>CLEAN AND MODERN DESIGN</a></li>
<li><a href="#"><span></span>FULLY RESPONSIVE</a></li>
<li><a href="#"><span></span>SINGLEPAGE & MULTIPAGE</a></li>
<li><a href="#"><span></span>GREAT FOR ANY BUSSINESS</a></li>
</ul>
</div>
</div>
<div class="clearfix"></div>
</div>
</div>
<!--SERVICES Footer-->
<div class="service-footer">
<div class="Get-started">
<a href="#">GET STARTED</a>
</div>
</div>
<!--SER