<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<head>
<title>E-comarce tamplet #2</title>
</head>
<body>
<!-- Start TopBar Site -->
<!-- which include (languge + carruncy + conact info + login) -->
<div class="Topbar">
<div class="container">
<div class="row">
<div class="contact-info col-md-8 col-xs-12">
<i class="fa fa-phone" aria-hidden="true"></i>
<span>Call Us: +84 958 000000</span>
<span>|</span>
<i class="fa fa-envelope" aria-hidden="true"></i>
<span>Email:support@yaongmain.com</span>
</div>
<div class="col-md-4 col-xs-12">
<div class="col-md-3"><i class="fa fa-lock" aria-hidden="true"><a href="#"> Log In</a></i></div>
<ul class="languge">
<li class="open-mune">
<img src="http://www.3rbz.com/uploads/08b20821ecc72.png" alt="1">
<span>ENGLISH</span>
<i class="fa fa-chevron-down"></i>
<i class="hidden fa fa-chevron-up"></i>
<span class="text-uppercase"><span>|</span> usd</span>
<i class="fa fa-chevron-down"></i>
<i class="hidden fa fa-chevron-up"></i>
</li>
<li class="list-unstyled">
<ul class="mune ">
<li>languge 1 - cuurancy</li>
<li>languge 2 - cuurancy</li>
</ul>
</li>
</ul>
</div>
</div>
</div>
</div>
<!-- End TopBar Site -->
<!-- Start NavBar -->
<nav class="navbar navbar-default" role="navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="col-sm-4 navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-tow" aria-expanded="false">
<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 text-uppercase hvr-grow-rotate" href="#">lagancee</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="col-sm-8 collapse navbar-collapse" id="navbar-tow">
<!-- Collect the nav links,other for toggling -->
<ul class="nav navbar-nav navbar-right">
<li><a href="#">home</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">shop <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Separated link</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">One more separated link</a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><img class='hot' src="http://www.3rbz.com/uploads/417fda45ecb13.png" alt="1">features <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Separated link</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">One more separated link</a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">portfolio <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Separated link</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">One more separated link</a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">blog <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Separated link</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">One more separated link</a></li>
</ul>
</li>
<li><a href="#">contact</a></li>
<li><a href="#"><i class="fa fa-search" aria-hidden="true"></i></a></li>
<li><a href="#"><i class="fa fa-shopping-bag" aria-hidden="true"></i></a></li>
</ul>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container-fluid -->
</nav>
<!-- End NavBar -->
<!-- Start Header Slider -->
<div id="myslide" class="headerslide carousel slide hidden-xs" data-ride="carousel">
<div class="carousel-inner" role="listbox">
<div class="item active">
<div class="row">
<div class="col-lg-3 col-sm-6 col-xs-12">
<img src="http://placehold.it/272x362" width="100%" alt="">
</div>
<div class="col-lg-3 col-sm-6 col-xs-12">
<img src="http://placehold.it/272x362" width="100%" alt="">
</div>
<div class="col-lg-3 col-sm-6 col-xs-12">
<img src="http://placehold.it/272x362" width="100%" alt="">
</div>
<div class="col-lg-3 col-sm-6 col-xs-12">
<img src="http://placehold.it/272x362" width="100%" alt="">
</div>
</div>
<div class="carousel-caption"></div>
</div>
<div class="item">
<div class="row">
<div class="col-lg-3 col-sm-6 col-xs-12">
<img src="http://placehold.it/272x362" width="100%" alt="">
</div>
<div class="col-lg-3 col-sm-6 col-xs-12">
<img src="http://placehold.it/272x362" width="100%" alt="">
</div>
<div class="col-lg-3 col-sm-6 col-xs-12">
<img src="http://placehold.it/272x362" width="100%" alt="">
</div>
<div class="col-lg-3 col-sm-6 col-xs-12">
<img src="http://placehold.it/272x362" width="100%" alt="">
</div>
</div>
<div class="carousel-caption"></div>
</div>
<div class="item">
<div class="row">
<div class="col-lg-3 col-sm-6 col-xs-12">
<img src="http://placehold.it/272x362" width="100%" alt="">
</div>
<div class="col-lg-3 col-sm-6 col-xs-12">
<img src="http://placehold.it/272x362" width="100%" alt="">
</div>
<div class="col-lg-3 col-sm-6 col-xs-12">
<img src="http://placehold.it/272x362" width="100%" alt="">
</div>
<div class="col-lg-3 col-sm-6 col-xs-12">
<img src="http://placehold.it/272x362" width="100%" alt="">
</div>
</div>
<div class="carousel-caption"></div>
</div>
</div>
<a class="left carousel-control" href="#myslide" role="button" data-slide="prev">
<div class="leftcontrol-slider">P R<br> E V</div>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#myslide" role="button" data-slide="next">
<div class="rightcontrol-slider">N E<br> X T</div>
<span class="sr-only">Next</span>
</a>
</div>
<!-- End Header Slider -->
<!-- Start About Content -->
<div class="about-content text-center">
<div class="container">
<h2 class="text-uppercase">wellcome to lagencee store</h2>
<img class='dotted' src="http://www.3rbz.com/uploads/61a890abdfc51.png" alt="1">
<p>We’re a team of creative and make amazing site in ecommerce from Unite States. We love colour pastel<br>highlight and simple, its make our design look so awesome</p>
<div class="row">
<div class=" col-md-4 col-xs-12">
<div class="item">
<i class="fa fa-map-marker" aria-hidden="true"></i>
<h3 class="text-uppercase">free shipping</h3>
<span>free for all over order 99.00$</span>
</div>
</div>
<div class=" col-md-4 col-xs-12">
<div class="item">
<i class="fa fa-usd" aria-hidden="true"></i>
<h3 class="text-uppercase">free shipping</h3>
<span>free for all over order 99.00$</span>
</div>
</div>
<div class=" col-md-4 col-xs-12">
<div class="item">
<i class="fa fa-comment-o" aria-hidden="true"></i>
<h3 class="text-uppercase">free shipping</h3>
<span>free for all over order 99.00$</span>
</div>
</div>
</div>
<hr>
</div>
</div>
<!-- End About Content -->
<div class="product-slider text-center">
<div class="container">
<h2 class="text-uppercase">check pur product</h2>
<img class='dotted' src="http://www.3rbz.com/uploads/61a890abdfc51.png" alt="1">
<div id="productslide" class="carousel slide" data-ride="carousel">
<ul class="carousel-indicators">
<li data-target="#productslide" data-slide-to="0" class="active">Best Seller</li>
<li data-target="#productslide" data-slide-to="1">New Arrival</li>
<li data-target="#productslide" data-slide-to="2">Most Wanted</li>
</ul>
<div class="carousel-inner" role="listbox">
<div class="item active">
<div class="row">
<div class="col-lg-3 col-sm-6 col-xs-12">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00</span></p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
<div class="col-lg-3 col-sm-6 col-xs-12">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00 <sub><del>$107.50</del></sub></span></p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
<div class="col-lg-3 col-sm-6 col-xs-12">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00</span> </p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
<div class="col-lg-3 col-sm-6 col-xs-12">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00</span> <sub><del>$109.50</del></sub></p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-3 col-sm-6 col-xs-12">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00</span></p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
<div class="col-lg-3 col-sm-6 col-xs-12">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00 <sub><del>$107.50</del></sub></span></p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
<div class="col-lg-3 col-sm-6 col-xs-12">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00</span> </p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
<div class="col-lg-3 col-sm-6 col-xs-12">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00</span> <sub><del>$109.50</del></sub></p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
</div>
</div>
<div class="item">
<div class="row">
<div class="col-lg-3 col-sm-6">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00</span><sub><del>$109.50</del></sub></p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
<div class="col-lg-3 col-sm-6">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00</span></p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
<div class="col-lg-3 col-sm-6">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00</span><sub><del>$109.50</del></sub></p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
<div class="col-lg-3 col-sm-6">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00</span></p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-3 col-sm-6 col-xs-12">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00</span></p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
<div class="col-lg-3 col-sm-6 col-xs-12">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00 <sub><del>$107.50</del></sub></span></p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
<div class="col-lg-3 col-sm-6 col-xs-12">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00</span> </p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
<div class="col-lg-3 col-sm-6 col-xs-12">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00</span> <sub><del>$109.50</del></sub></p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
</div>
</div>
<div class="item">
<div class="row">
<div class="col-lg-3 col-sm-6">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00</span></p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
<div class="col-lg-3 col-sm-6">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00</span><sub><del>$109.50</del></sub></p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
<div class="col-lg-3 col-sm-6">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00</span></p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
<div class="col-lg-3 col-sm-6">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00</span></p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-3 col-sm-6 col-xs-12">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00</span></p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
<div class="col-lg-3 col-sm-6 col-xs-12">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00 <sub><del>$107.50</del></sub></span></p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
<div class="col-lg-3 col-sm-6 col-xs-12">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00</span> </p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
<div class="col-lg-3 col-sm-6 col-xs-12">
<div class="slide-img"><img src='http://www.3rbz.com/uploads/3d77ec5159011.jpg' alt='1' style="width:262px; height:360px;border:1px solid #ccc">
<div class="hover-slideproduct"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></div>
</div>
<div class="product-content">
<h3><a class="product-title" href="#">london t-shirt</a></h3>
<p class="regular-product"><span>$250.00</span> <sub><del>$109.50</del></sub></p>
<button class="btn addcart">Add To Cart</button>
<button class="btn"><i class="fa fa-heart"></i></button>
<button class="btn"><i class="fa fa-pie-chart"></i></button>
</div>
</div>
</div>
</div>
</div>
</div>
<hr>
</div>
</div>
<!-- Start Blog -->
<div class="blog">
<div class="container">
<h3 class=" text-center text-uppercase">from the blog</h3>
<div class="row">
<div class="col-md-4 col-xs-12">
<img class="img-responsive" src="http://www.3rbz.com/uploads/5d9e7bbe41f81.jpg" style="width:370px;height:255px" alt="1">
<div class="blog-title">
<h3>Trending For 217</h3>
<i class="fa fa-calendar" aria-hidden="true"></i>
<span>03-01-2017</span>
<i class="fa fa-comment-o" aria-hidden="true"></i>
<span>12Comment</span>
</div>
</div>
<div class="col-md-4 col-xs-12">
<img class="img-responsive" src="http://www.3rbz.com/uploads/5d9e7bbe41f81.jpg" style="width:370px;height:255px" alt="1">
<div class="blog-title">
<h3>Trending For 217</h3>
<i class="fa fa-calendar" aria-hidden="true"></i>
<span>03-01-2017</span>
<i class="fa fa-comment-o" aria-hidden="true"></i>
<span>12Comment</span>
</div>
</div>
<div class="col-md-4 col-xs-12">
<img class="img-responsive" src="http://www.3rbz.com/uploads/5d9e7bbe41f81.jpg" style="width:370px;height:255px" alt="1">
<div class="blog-title">
<h3>Trending For 217</h3>
<i class="fa fa-calendar" aria-hidden="true"></i>
<span>03-01-2017</span>
<i class="fa fa-comment-o" aria-hidden="true"></i>
<span>12Comment</span>
</div>
</div>
</div>
<hr>
</div>
</div>
<!-- End Blog -->
<!-- Start Fotter -->
<div class="fotter">
<div class="container">
<div class="row">
<div class="part1 col-lg-3 col-md-4">
<h2 class="text-center text-uppercase">logancee</h2>
<p class=" text-center">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi auctor neque nec quam dignissim, ut condimentum nunc semper.</p>
</div>
<div class="part2 col-lg-3 col-md-4">
<h4 class="text-uppercase">information</h4>
<ul>
<li><a href="#">Carieers</a></li>
<li><a href="#">Investor relations</a></li>
<li><a href="#">Press releases</a></li>
<li><a href="#">Shop with points</a></li>
</ul>
</div>
<div class="part3 col-lg-3 col-md-4">
<h4 class="text-uppercase">customer care</h4>
<ul>
<li><a rel="nofollow" href="#">Returns</a></li>
<li><a rel="nofollow" href="#">Shipping info</a></li>
<li><a rel="nofollow" href="#">Gift cards</a></li>
<li><a rel="nofollow" href="#">Size guide</a></li>
</ul>
</div>
<div class="part4 col-lg-3 col-md-6">
<h4 class="text-uppercase">get in touch</h4>
<ul class="list-unstyled">
<li>
<div class="row">
<div class="col-xs-1">
<i class="fa fa-home fa-lg"></i>
</div>
<div class="col-xs-10">
<span>123 New Design Str, ABC building, Melbun Australlia</span>
</div>
</div>
</li>
<li>
<div class="row">
<div class="col-xs-1">
<i class="fa fa-mobile fa-lg"></i>
</div>
<div class="col-xs-10">
<span>12345666</span>
</div>
</div>
</li>
<li>
<div class="row">
<div class="col-xs-1">
<i class="fa fa-envelope-o fa-lg"></i>
</div>
<div class="col-xs-10">
<span>hello@YourDomain.com</span>
</div>
</div>
</li>
</ul>
</div>
</div>
<hr>
<div class="copyright text-center">
<p>© 2017 <a href="#">LOGANCEE</a> All Right Reserved.</p>
</div>
</div>
</div>
<!-- Start Fotter -->
<script src="js/jquery-1.12.3.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jq1.js"></script>
</body>
* {
font-family: 'Sansita', sans-serif
}
a {
color: black
}
.overhidden {
overflow: hidden
}
ul,ol{
list-style-type: none
}
.hiden {
display: none
}
/************************
Start TopBar Site
*************************/
select,
select >option,
input{
border-width: 0px;
outline: none;
cursor: pointer
}
.Topbar {
padding: 30px 0 65px 0;
font-size: 15px;
letter-spacing: .75px;
}
.Topbar .contact-info {
cursor: pointer;
}
.Topbar .contact-info i {
margin-right: 5px
}
.Topbar .contact-info span:hover {
color: red;
font-size: 15px;
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
.Topbar .contact-info span {
margin-left: 5px
}
.Topbar .contact-info span:nth-child(3){
margin: 0 5px
}
.Topbar .open-mune{
position: relative
}
.Topbar .open-mune ,
.Topbar .mune
{
list-style-type: none;
cursor: pointer
}
.Topbar .open-mune img {
margin-right: 10px
}
.Topbar .open-mune span {
margin-right: 10px
}
.Topbar .open-mune i {
margin-right: 10px
}
.Topbar .mune {
display: none;
position: absolute;
left: 100px
}
/************************
End TopBar Site
*************************/
/************************
Start NavBar Site
*************************/
.navbar-brand {
font-size: 50px
}
.navbar-default {
background-color: transparent;
border-color: transparent
}
.navbar-right {
font-size: 17px
}
.navbar-default .navbar-brand,
.navbar-default .navbar-nav > li > a{
color: black
}
.navbar-nav > li {
font-size: 16px;
text-transform: uppercase;
letter-spacing: 1px;
color: black
}
.hot {
position: absolute;
top: -8px;
left: 30px;
}
/************************
End NavBar Site
*************************/
/************************
Start Header Slider
*************************/
.headerslide {
padding: 30px 0
}
.carousel-control.left,
.carousel-control.right {
background-image: none
}
.carousel-control {
width: 5%
}
.carousel-control>div{
position: absolute;
width: 85%;
height: 15%;
background-color: rgba(128, 128, 128, 0.68);
top: 44%;
left: 11%;
}
/************************
End Header Slider
*************************/
/************************
Start About Content
************************/
.about-content h2 {
letter-spacing: 1px
}
.about-content .dotted {
margin: 20px 0;
}
.about-content p{
font-family: sans-serif;
color: gray;
}
.about-content .item{
margin: 50px 0;
cursor: pointer;
height: 221px;
background: rgba(220, 218, 218, 0.83);
}
.about-content .item:hover {
transform: scale(1.01);
background-color: gray;
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
.about-content .item i{
font-size: 40px;
margin-top: 50px;
color: #afacac;
}
.about-content .item span {
color: #afacac;
}
/************************
End About Content
************************/
/**********************
product-slider
**********************/
.product-slider {
padding-top: 30px;
position: relative
}
.product-slider .carousel-indicators {
top:-56px;
bottom: inherit;
left: 53%
}
.carousel-inner {
margin-top: 60px
}
.product-slider .item .slide-img {
overflow: hidden;
position: relative;
cursor: pointer
}
.product-slider .item .slide-img:hover .hover-slideproduct {
right: 0;
-webkit-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
}
.product-slider .item .slide-img .hover-slideproduct{
line-height: 43px
}
.product-slider .item .slide-img .hover-slideproduct{
position: absolute;
display: inline;
content: "";
width: 50px;
height: 50px;
background-color: black;
color: #fff;
bottom: 0px;
right: -50px;
}
.product-slider .carousel-indicators li,
.product-slider .carousel-indicators .active {
display: inline;
padding-right: 4%;
border: none;
background-color: transparent;
font-size: 25px;
font-weight: bold;
color: #ccc;
}
.product-slider .carousel-indicators li.active {
color: black
}
.product-slider .carousel-indicators li:before{
content: "";
display: inline-block;
background: #ccc;
border-radius: 50%;
width: 10px;
height: 10px;
margin-right: 10px;
}
.product-slider .carousel-indicators li:first-child:before{
display: none
}
.product-slider .product-content .product-title:hover {
text-decoration: none;
color: #908b8b
}
.product-slider .product-content del {
color: #ccc;
font-size: 15px;
}
.product-slider .product-content button {
background-color: transparent;
border: 1px solid #ccc
}
.product-slider .product-content button:hover {
transform: scale(1.1);
box-shadow: 10px 7px 25px -1px rgba(0,0,0,0.75);
-webkit-box-shadow: 10px 7px 25px -1px rgba(0,0,0,0.75);
-moz-box-shadow: 10px 7px 25px -1px rgba(0,0,0,0.75)
-webkit-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
}
.product-slider .product-content .addcart {
background-color: #333333;
color: #fff
}
.carousel-control.left,
.carousel-control.right{
background-image: none
}
.carousel-control .glyphicon-chevron-left,
.carousel-control .glyphicon-chevron-right{
position: relative;
top: 8.5%;
width: 25px;
height: 25px;
margin-top: -10px;
font-size: 12px;
border: 1px solid #ccc;
line-height: 25px;
background-color: black;
color: #fff;
}
.carousel-control .glyphicon-chevron-left {
left: 269%
}
.carousel-control .glyphicon-chevron-right {
right: 266%
}
.carousel-control .glyphicon-chevron-left:hover,
.carousel-control .glyphicon-chevron-right:hover{
background-color: transparent;
color: black;
}
.dash{
position: absolute;
left: 309%;
top: 59px;
width: 104px;
color: #b9b7b7;
text-shadow: none;
}
.slide-control{
padding-bottom: 30px
}
/***********************
End About Content
************************/
/********************
Start Blog
*********************/
.blog h3 {
margin-bottom: 30px;
letter-spacing: 1px;
}
.blog .blog-title {
position: absolute;
bottom: 0;
color: #fff;
padding: 24px;
}
.blog .blog-title span {
margin-right: 10px
}
.blog .blog-title i {
margin-right: 10px
}
/********************
End Blog
*********************/
/********************
Start Fotter
*********************/
.fotter{
padding: 50px 0 25px 0
}
.fotter h2,
.fotter h4 {
letter-spacing: 1px
}
.fotter h2 {
margin-top: 3px
}
.fotter .part1 p {
color: rgba(158, 157, 157, 0.9);
line-height: 32px;
letter-spacing: .2px;
}
.fotter .part2 h4{
margin-left: 23px;
}
.fotter .part2 ul,
.fotter .part3 ul{
list-style-type: square;
color: rgba(158, 157, 157, 0.9);
line-height: 35px;
letter-spacing: 1px;
}
.fotter .part2 ul li a,
.fotter .part3 ul li a {
color: rgba(158, 157, 157, 0.9);
}
.fotter .part2 ul li a:hover,
.fotter .part3 ul li a:hover {
color: black
}
.fotter .part4 ul {
color: rgba(158, 157, 157, 0.9);
line-height: 30px;
letter-spacing: 1px;
margin-top: 23px;
}
.fotter .copyright {
color: rgba(158, 157, 157, 0.9);
letter-spacing: 1px;
}
.fotter .copyright p a {
color: black
}
/********************
End Fotter
*********************/
/*******************************************************
* *****************************************************/
@media (max-width : 767px){
.Topbar .languge,
.Topbar .socail ul {
padding: 0
}
.Topbar .socail ul {
float: initial;
margin-top: 20px;
}
.Topbar .mune {
left: 24px;
background: rgba(0, 0, 0, 0.72);
color: #fff;
border-radius: 10px;
padding: 20px;
}
.Topbar .open-mune i {
font-size: xx-small
}
.Topbar .center-div >span {
margin: 0;
letter-spacing: 1px;
font-size: 15px;
}
.secondbar {
padding: 0
}
.Topbar {
padding: 20px 0 0 0 ;
text-align: center;
}
.secondbar .itemcart ul{
display: -webkit-inline-box;
float: right;
margin-top:0
}
.navbar .navbar-collapse {
text-align: center;
position: absolute;
background: rgba(0, 0, 0, 0.77);
z-index: 9999;
width: 100%;
}
.navbar-default .navbar-nav > li > a {
color: white;
}
.navbar-default .navbar-nav > li > a:hover {
color: red
}
.hot {
display: none
}
.front-header .header-slider .carousel-caption h2 {
font-size: 13px
}
.front-header .header-slider .carousel-caption p{
display: none
}
.front-header .header-slider .carousel-caption button {
padding: 0
}
.front-header .header-slider .carousel-indicators {
left: 50% !important
}
.carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right {
top: 5%
}
.dash {
display: none
}
.fotter {
text-align: center
}
.navbar-brand {
font-size: 36px
}
.about-content .item {
margin: 20px 0 0 0
}
.product-slider {
padding: 0
}
.product-slider .carousel-indicators li, .product-slider .carousel-indicators .active {
padding: 0;
font-weight: normal;
font-size: 12px
}
.blog {
text-align: center
}
.blog .row >div {
float: none
}
.blog .row >div>img {
display: inline-block;
}
}
@media (min-width: 768px) and (max-width: 991px) { /* Small Devices, Tablets */
.Topbar .center-div >span {
margin: 0;
}
.front-header .header-slider .carousel-indicators {
left: 50% !important
}
.blog .row div img {
text-align: center
}
.navbar-default .navbar-nav > li > a {
color: #848181 !important
}
.Topbar {
padding: 20px 0 0px 0;
text-align: center
}
}
@media (min-width: 992px) and (max-width: 1199px) { /* Medium Devices, Desktops */
.front-header .header-slider .carousel-caption {
left: 20%
}
.front-header .header-slider .carousel-indicators {
left: 50% !important
}
.front-header .super-sale{
height: 358px
}
.front-header .super-sale h2 {
margin-top: 87px
}
.carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right {
top: 5%
}
.carousel-control .glyphicon-chevron-right {
right: 249%;
}
carousel-control .glyphicon-chevron-left {
left: 259%;
}
.product-slider .item .slide-img:hover .hover-slideproduct {
right: 46px
}
}
@media (min-width : 1200px) /* Large Devices, Wide Screens */
{
}
/* End Media Quary*/
