Thank you for purchasing DREAM.
“DREAM” is a Corporate Template which have clean & modern with Responsive design.
This template, which is a responsive layout for tablet and other mobile devices, is based on the HTML5 structure and Twitter Bootstrap 3. Visit http://getbootstrap.com/ to learn more about Bookstrap. For a detailed information about its grid system, click on http://getbootstrap.com/css/#grid.
As a brief explanation, the grid is composed of 12 columns; each named as "col-xs-1", "col-md-2", "col-lg-3", "col-xs-4", and so on and so forth. The column divisions are grouped in rows.
The grid system works for multiple devices. Please check the table below.
| Extra Small Devices(<481) | Small Devices(≥768) | Medium Devices(≥992) | Large Devices(≥1200) | |||||
| Container width | Auto | |||||||
| Class Prefix | col-xs- | col-sm- | col-md- | col-lg- | ||||
Simple grid layout looks like following:
<!-- Caption Start -->
<section id="caption" class="page-content">
<div class="container">
<div class="row">
<div class="col-lg-12">
<h2 class="text-uppercase text-center">Welcome to our site</h2>
<p class="low-width text-center">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque, optio corporis quae nulla aspernatur in alias at numquam rerum ea excepturi expedita tenetur assumenda voluptatibus eveniet incidunt dicta nostrum quod</p>
</div>
</div>
</div>
</section>
<!-- Caption End -->
All css files are located in the /css.
This template imports several JS files.
The Javascript files are loaded in the footer. All files are loaded at the bottom to increase the site speed and rendering.
The Javascript files used in this template are the following:
Change a default logo by changing logo.png in the /images directory, or by opening the page and changing the following code.
<a class="navbar-brand page-scroll" href="#home"><img src="images/logo-white.png" height="40" width="150" id="logo" alt="logo top"></a>
Change the logo in /images/logo.png.
To change the default navigation by opening the page and changing the following code.
<nav class="navbar navbar-fixed-top">
<div class="container">
<div class="navbar-header page-scroll">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>
<a class="navbar-brand page-scroll" href="#home"><img src="images/logo-white.png" height="40" width="150" id="logo" alt="logo top"></a> </div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li class="active"> <a data-scroll href="#home">Home</a> </li>
<li> <a data-scroll href="#about">About</a> </li>
<li> <a data-scroll href="#portfolio">Works</a> </li>
<li> <a data-scroll href="#testimonials">Testimonials</a> </li>
<li> <a data-scroll href="#services">Services</a> </li>
<li> <a data-scroll href="#team">Team</a> </li>
<li> <a data-scroll href="#pricing">Pricing</a> </li>
<li> <a data-scroll href="#blog">Blog</a> </li>
<li> <a data-scroll href="#address">Contact</a> </li>
</ul>
</div>
</div>
</nav>
<header id="home">
<div class="container">
<div class="intro-text">
<p class="intro-heading">welcome to our site we are here to help people</p>
<h1 class="intro-lead-in">Just Modify & upload</h1>
<form action="#" method="post">
<input type="text" placeholder="Search Here">
<input type="submit" value="search now">
</form>
</div>
</div>
</header>
<section id="footer" class="footer">
<div class="container">
<div class="footer-top">
<div class="row">
<div class="col-lg-3">
<div class="footer-logo"><a href="#"><img src="images/logo-white.png" alt="logo bottom"></a></div>
</div>
<div class="col-lg-9">
<div class="footer-description">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived. </div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4">
<div class="footer-item">
<h4>subscribe</h4>
<form action="#" method="post">
<input type="text" placeholder="Subscribe your mail id">
<input type="submit">
</form>
</div>
<div class="footer-item-social">
<h4>Social icons</h4>
<a href="#"><i class="fa fa-facebook fa-2x"></i></a><a href="#"><i class="fa fa-linkedin fa-2x"></i></a><a href="#"><i class="fa fa-twitter fa-2x"></i></a><a href="#"><i class="fa fa-google-plus fa-2x"></i></a><a href="#"><i class="fa fa-pinterest-p fa-2x"></i></a> </div>
</div>
<div class="col-lg-4">
<div class="footer-item">
<h4>our Categories</h4>
<ul>
<li><i class="fa fa-chevron-right fa-1x"></i><a href="#">Layout Design </a></li>
<li><i class="fa fa-chevron-right fa-1x"></i><a href="#">Html</a></li>
<li><i class="fa fa-chevron-right fa-1x"></i><a href="#">Css </a></li>
<li><i class="fa fa-chevron-right fa-1x"></i><a href="#">Jquery</a></li>
<li><i class="fa fa-chevron-right fa-1x"></i><a href="#">Php</a></li>
<li><i class="fa fa-chevron-right fa-1x"></i><a href="#">iPhone</a></li>
<li><i class="fa fa-chevron-right fa-1x"></i><a href="#">Android </a></li>
</ul>
</div>
</div>
<div class="col-lg-4">
<div class="footer-item">
<h4>our recent posts</h4>
<div class="media"> <a class="pull-left" href="#"> <img class="media-object" src="http://placehold.it/80x80" alt=""> </a>
<div class="media-body">
<p><a href="#">Lorem Ipsum has been the industry's Standard</a><br>
<span>18 jan 2015</span></p>
</div>
</div>
<div class="media"> <a class="pull-left" href="#"> <img class="media-object" src="http://placehold.it/80x80" alt=""> </a>
<div class="media-body">
<p><a href="#">Lorem Ipsum has been the industry's Standard</a><br>
<span>18 jan 2015</span></p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
In every page you will find the elements within "section" tag. You just have to edit that section to modify that element.
<section id="pricing" class="section-ash">
<div class="container">
<div class="row">
<div class="col-lg-12">
<h5>affordable price list</h5>
<h2>our pricing</h2>
</div>
</div>
<div class="row">
<div class="col-lg-4">
<div class="pricing-box active">
<h6>Basic</h6>
<h3>$29.29<br/>
<span>/month</span></h3>
<input type="button" value="Subscribe" class="subscribe">
<p>Free setup</p>
<p>Edit your listing
<p>100% satisfaction gurentee
<p>Free hosting
<p>One year free service</p>
</div>
</div>
<div class="col-lg-4">
<div class="pricing-box pricing-box-active">
<h6>Premium</h6>
<h3>$50.29<br/>
<span>/month</span></h3>
<input type="button" value="Subscribe" class="subscribe">
<p>Free setup</p>
<p>Edit your listing
<p>100% satisfaction gurentee
<p>Free hosting
<p>One year free service</p>
</div>
</div>
<div class="col-lg-4">
<div class="pricing-box">
<h6>Gold</h6>
<h3>$70.29<br/>
<span>/month</span></h3>
<input type="button" value="Subscribe" class="subscribe">
<p>Free setup</p>
<p>Edit your listing
<p>100% satisfaction gurentee
<p>Free hosting
<p>One year free service</p>
</div>
</div>
</div>
</div>
</section>
Any Images or logos used in previews are not included in this item or final purchase and you need to contact authors to get permission in case you want to use them in your commercial or non-commercial projects.
We used http://placehold.it/ for Image placeholders.