<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Lofty Ride</title>
<!--  --attached stylesheet link-  -->
<link href="style.css" rel="stylesheet" type="text/css"/>
<!--  --attached stylesheet link-  -->
</head>

<body>
<header>
    <div class="container-fluid header1">
        <!--    ======top-bar start===    -->
            <div class="row bg-border">
                <div class="container">
                    <div class="row">
                            <div class="col-md-12">                            
                                    <ul class="topbar-ul">
                                        <li><a href="#">My Account </a></li>
                                        <li><a href="#">Register </a></li>
                                        <li><a href="#">Sign in </a></li>
                                        <li><a href="#">My Cart(<span>0</span>)</a></li>
                                    </ul>                           
                            </div>
                    </div>
                </div>
            </div>
        <!--  ======top-bar end===  -->
            <div class="row">
                    <div class="container">
                        <div class="row">
                            <div class="col-md-12">
                                    <!--  -===============logo and main-menu start===============  -->
                                    
                                    <nav class="navbar navbar-default main-menu">
      
                                            <!--   Brand and toggle get grouped for better mobile display   -->
                                            <div class="navbar-header">
                                              <button type="button" class="navbar-toggle collapsed" 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" href="index.html"><img src="images/logo-small.png" class="logo-img" alt="Logo"></a>
                                            </div>
                                        
                                            <!--   Collect the nav links, forms, and other content for toggling   -->
                                            <div class="collapse navbar-collapse pull-right" id="bs-example-navbar-collapse-1">
                                              <ul class="nav navbar-nav">
                                                <li><a href="#">Home</a></li>
                                                <li><a href="#">ENVE </a></li>
                                                <li><a href="#">Bikes </a></li>
                                                <li><a href="#">Apparel </a></li>
                                                <li><a href="#">Accessories </a></li>
                                                <li><a href="#">Sales </a></li>
                                               <li><a href="#"> Rental/Demo   </a> </li>
                                               <li><a href="#">Outdoor Recreation</a></li>
                                               <li><a href="#">Contact </a></li>
                                              </ul>
                                              
                                              
                                            </div><!--   /.navbar-collapse   -->
                                         
                                        </nav>
    <!--  -===============logo and main-menu start===============  -->
                                    </div>
                            </div>
                        </div>
                    </div>
           
    </div>
</header>
<!--  ======================middle content start=================  -->
<div id="main">
    <div class="container-fluid banner-sect">
        <div class="row">
            <!--  ---------------slider starts----------  -->
                <div id="carousel-example-generic" class="carousel slide banner-slide" data-ride="carousel"> 
        
                            <!--   Wrapper for slides   -->
                              <div class="carousel-inner" role="listbox">
                                <div class="item active">
                                  <img src="images/banner-2.png" alt="slide1"> 
                                                                  
                                  <div class="carousel-caption b-caption">
                                    <h4>Experience Perfection</h4>
                                    <p>Event Duis bibendum malesuada massa vel volutpat. Sed accumsan arcu eu sapien ultrices, et tempor leo aliquam. 
Sed at felis tempor, rhoncus odio quis.</p>
									<a href="#" class="btn btn-visit">Visit lofty rides events</a>
                                    <a href="#" class="icon-b"><img src="images/google-play-icon.png" alt="Google Play"></a>
                                  </div>
                                  
                                </div>
                                
                                <div class="item">
                                  <img src="images/banner-1.png" alt="Banner">
                                  <!--  <div class="carousel-caption">
                                    ...
                                  </div>  -->
                                </div>
                                
                              </div>
        
                              <!--   Controls   -->
                              <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
                                <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"><img src="images/left-arrow.png" alt="Left Arrow"></span>
                                <span class="sr-only">Previous</span>
                              </a>
                              <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
                                <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"><img src="images/right-arrow.png" alt="Right Arrow"></span>
                                <span class="sr-only">Next</span>
                              </a>
                    </div>
            <!--  ---------------slider starts----------  -->
         </div>
         
     </div>
     
     <!--  =======tp-box ============  -->
    <div class="container up-box">
    	<div class="row">
            <div class="col-md-4">
                <div class="tp-box">
                <div class="tp-box-img"><img src="images/bike-rentals.png" alt="Bike Rentals"></div><span>Bike Rentals</span>
                    <div class="view-more-sales">
                    <a href="#"><span>view more</span></a>
                    </div>
                </div>
            </div>
            <div class="col-md-4">
                <div class="tp-box">
                <div class="tp-box-img"><img src="images/sales.png" alt="Sales"></div><span>Sales</span>
                    <div class="view-more-sales">
                    <a href="#"><span>view more</span></a>
                    </div>
                </div>
            </div>
            <div class="col-md-4">
                <div class="tp-box last-tpbox">
                <div class="tp-box-img"><img width="80" src="images/outdoor-img.png" alt="Out Door"></div><span>Outdoor Recreational </span>
                    <div class="view-more-sales">
                    <a href="#"><span>view more</span></a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--  =======tp-box============  -->
<section>    
	<div class="container">
        <!--  ===========product slider1====================  -->
            <div class="row pr-slider">
                <div class="col-md-12">
                    <h4 class="p-heading1">Top Seller</h4>
                
                        <div id="owl-example1" class="owl-carousel product-slider">
    
                    
                        <div class="item">
                            
                              <img src="images/bike1.png" alt="Touch">
                                <h3 class="item-h3">Moots Vamoots RSL Ultegra </h3>
                                <div class="cart-btn">
                                <a href="#" class="btn buy-btn">Add To Cart</a>
                                <a href="#" class="btn buy-btn">Buy Now</a>
                                </div>
                        </div>
                   
                    
                         <div class="item">
                            
                              <img src="images/bike2.png" alt="Touch">
                               <h3 class="item-h3">Moots Vamoots RSL Ultegra </h3>
                               <div class="cart-btn">
                                <a href="#" class="btn buy-btn">Add To Cart</a>
                                <a href="#" class="btn buy-btn">Buy Now</a>
                                </div>
                        </div>
                        
                        <div class="item">
                            
                              <img src="images/bike3.png" alt="Touch">
                                <h3 class="item-h3">Moots Vamoots RSL Ultegra </h3>
                                <div class="cart-btn">
                                <a href="#" class="btn buy-btn">Add To Cart</a>
                                <a href="#" class="btn buy-btn">Buy Now</a>
                                </div>
                        </div>
                        
                        <div class="item">
                            
                              <img src="images/bike4.png" alt="Touch">
                                <h3 class="item-h3">Moots Vamoots RSL Ultegra </h3>
                                <div class="cart-btn">
                                <a href="#" class="btn buy-btn">Add To Cart</a>
                                <a href="#" class="btn buy-btn">Buy Now</a>
                                </div>
                        </div>   
                       
                        
                        <div class="item">
                            
                              <img src="images/bike1.png" alt="Touch">
                                <h3 class="item-h3">Moots Vamoots RSL Ultegra </h3>
                                <div class="cart-btn">
                                <a href="#" class="btn buy-btn">Add To Cart</a>
                                <a href="#" class="btn buy-btn">Buy Now</a>
                                </div>
                               
                        </div>
                        
                        <div class="item">
                            
                              <img src="images/bike2.png" alt="Touch">
                               <h3 class="item-h3">Moots Vamoots RSL Ultegra </h3>
                               <div class="cart-btn">
                                <a href="#" class="btn buy-btn">Add To Cart</a>
                                <a href="#" class="btn buy-btn">Buy Now</a>
                                </div>
                               
                        </div>
                        
                        <div class="item">
                            
                              <img src="images/bike3.png" alt="Touch">
                                <h3 class="item-h3">Moots Vamoots RSL Ultegra </h3>
                                <div class="cart-btn">
                                <a href="#" class="btn buy-btn">Add To Cart</a>
                                <a href="#" class="btn buy-btn">Buy Now</a>
                                </div>
                              
                        </div>
                    
                     </div>
    
                  </div>
            </div>
         <!--  ===========product slider1====================  -->
         
         <!--  ===========product slider1====================  -->
            <div class="row pr-slider">
                <div class="col-md-12">
                    <h4 class="p-heading1">Top Rentals</h4>
                
                        <div id="owl-example2" class="owl-carousel product-slider">
    
                    
                        <div class="item">
                            
                              <img src="images/bike1.png" alt="Touch">
                                <h3 class="item-h3">Moots Vamoots RSL Ultegra </h3>
                                <div class="cart-btn">
                                <a href="#" class="btn buy-btn">Add To Cart</a>
                                <a href="#" class="btn buy-btn">Buy Now</a>
                                </div>
                        </div>
                   
                    
                         <div class="item">
                            
                              <img src="images/bike2.png" alt="Touch">
                               <h3 class="item-h3">Moots Vamoots RSL Ultegra </h3>
                               <div class="cart-btn">
                                <a href="#" class="btn buy-btn">Add To Cart</a>
                                <a href="#" class="btn buy-btn">Buy Now</a>
                                </div>
                        </div>
                        
                        <div class="item">
                            
                              <img src="images/bike3.png" alt="Touch">
                                <h3 class="item-h3">Moots Vamoots RSL Ultegra </h3>
                                <div class="cart-btn">
                                <a href="#" class="btn buy-btn">Add To Cart</a>
                                <a href="#" class="btn buy-btn">Buy Now</a>
                                </div>
                        </div>
                        
                        <div class="item">
                            
                              <img src="images/bike4.png" alt="Touch">
                                <h3 class="item-h3">Moots Vamoots RSL Ultegra </h3>
                                <div class="cart-btn">
                                <a href="#" class="btn buy-btn">Add To Cart</a>
                                <a href="#" class="btn buy-btn">Buy Now</a>
                                </div>
                        </div>   
                       
                        
                        <div class="item">
                            
                              <img src="images/bike1.png" alt="Touch">
                                <h3 class="item-h3">Moots Vamoots RSL Ultegra </h3>
                                <div class="cart-btn">
                                <a href="#" class="btn buy-btn">Add To Cart</a>
                                <a href="#" class="btn buy-btn">Buy Now</a>
                                </div>
                               
                        </div>
                        
                        <div class="item">
                            
                              <img src="images/bike2.png" alt="Touch">
                               <h3 class="item-h3">Moots Vamoots RSL Ultegra </h3>
                               <div class="cart-btn">
                                <a href="#" class="btn buy-btn">Add To Cart</a>
                                <a href="#" class="btn buy-btn">Buy Now</a>
                                </div>
                               
                        </div>
                        
                        <div class="item">
                            
                              <img src="images/bike3.png" alt="Touch">
                                <h3 class="item-h3">Moots Vamoots RSL Ultegra </h3>
                                <div class="cart-btn">
                                <a href="#" class="btn buy-btn">Add To Cart</a>
                                <a href="#" class="btn buy-btn">Buy Now</a>
                                </div>
                              
                        </div>
                    
                     </div>
    
                  </div>
            </div>
         <!--  ===========product slider1====================  -->
    </div>
</section>
<section>
    <div class="container-fluid fs-section">
    	<div class="row">
        	<div class="container">
            	<div class="row">
                    <div class="col-md-12">
                    <h4 class="fs-heading1">Maecenas facilisis metus semper</h4>
                    <h4 class="fs-heading2">Aenean sit amet feugiat odio. Phasellus fringilla nisi ac tellus mollis, in laoreet massa convallis. Suspendisse aliquam ex ultricies volutpat eleifend. Vestibulum sodales magna nec ex varius, in sodales justo imperdiet. Vestibulum aliquam ipsum ut tempor faucibus. </h4>
                    </div>
                </div>
                
                <div class="row">
                    <div class="col-md-4">
                        <div class="fs-div">
                           <div class="fs-h3">
                          	 <h3><span>Extra</span> 15% off
                             <small>on every item over $1,000</small></h3>
                           </div> 
                        </div>
                    </div>
                    <div class="col-md-4">
                    	<div class="fs-div">
                             <div class="fs-h3">
                                 <h3><span>free</span> Shipping
                                 <small>on Order over $1,000</small></h3>
                           	  </div> 
                        </div>                    
                    </div>
                    <div class="col-md-4">
                   		<div class="fs-div">
                            <div class="fs-h3">
                                 <h3><span>+1234</span> 888 999
                                 <small>Monday-Saturday 10am-8pm</small></h3>
                            </div> 
                        </div>                    
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

<section>
	<div class="container">
 		<!--  ===========product slider3====================  -->
            <div class="row pr-slider">
                <div class="col-md-12">
                    <h4 class="p-heading1">Outdoor Recreational </h4>
                
                        <div id="owl-example3" class="owl-carousel product-slider">
    
                    
                        <div class="item">
                            
                              <img src="images/product-img1.png" alt="Touch">
                                <h3 class="item-h3">Moots Vamoots RSL Ultegra </h3>
                                <div class="cart-btn">
                                <a href="#" class="btn buy-btn">Add To Cart</a>
                                <a href="#" class="btn buy-btn">Buy Now</a>
                                </div>
                        </div>
                   
                    
                         <div class="item">
                            
                              <img src="images/product-img2.png" alt="Touch">
                               <h3 class="item-h3">Moots Vamoots RSL Ultegra </h3>
                               <div class="cart-btn">
                                <a href="#" class="btn buy-btn">Add To Cart</a>
                                <a href="#" class="btn buy-btn">Buy Now</a>
                                </div>
                        </div>
                        
                        <div class="item">
                            
                              <img src="images/product-img3.png" alt="Touch">
                                <h3 class="item-h3">Moots Vamoots RSL Ultegra </h3>
                                <div class="cart-btn">
                                <a href="#" class="btn buy-btn">Add To Cart</a>
                                <a href="#" class="btn buy-btn">Buy Now</a>
                                </div>
                        </div>
                        
                        <div class="item">
                            
                              <img src="images/product-img4.png" alt="Touch">
                                <h3 class="item-h3">Moots Vamoots RSL Ultegra </h3>
                                <div class="cart-btn">
                                <a href="#" class="btn buy-btn">Add To Cart</a>
                                <a href="#" class="btn buy-btn">Buy Now</a>
                                </div>
                        </div>   
                       
                        
                        <div class="item">
                            
                              <img src="images/product-img1.png" alt="Touch">
                                <h3 class="item-h3">Moots Vamoots RSL Ultegra </h3>
                                <div class="cart-btn">
                                <a href="#" class="btn buy-btn">Add To Cart</a>
                                <a href="#" class="btn buy-btn">Buy Now</a>
                                </div>
                               
                        </div>
                        
                        <div class="item">
                            
                              <img src="images/product-img2.png" alt="Touch">
                               <h3 class="item-h3">Moots Vamoots RSL Ultegra </h3>
                               <div class="cart-btn">
                                <a href="#" class="btn buy-btn">Add To Cart</a>
                                <a href="#" class="btn buy-btn">Buy Now</a>
                                </div>
                               
                        </div>
                        
                        <div class="item">
                            
                              <img src="images/product-img3.png" alt="Touch">
                                <h3 class="item-h3">Moots Vamoots RSL Ultegra </h3>
                                <div class="cart-btn">
                                <a href="#" class="btn buy-btn">Add To Cart</a>
                                <a href="#" class="btn buy-btn">Buy Now</a>
                                </div>
                              
                        </div>
                    
                     </div>
    
                  </div>
            </div>
         <!--  ===========product slider1====================  -->
	</div>
</section>
</div>

<!--  ======================middle content end=================  -->

<footer>
    <div class="container-fluid footer-bg1">
        <div class="row">
        	<div class="container">
            	<div class="row">
                	<div class="col-md-3">
                    	<div class="footer-div">
                        	<h3>Information</h3>
                            <ul class="footer-ul">
                            	<li><a href="#">About Us</a></li>
                                <li><a href="#">Delivery Information</a></li>
                                <li><a href="#">Privacy Policy</a></li>
                                <li><a href="#">Terms & Conditions</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="col-md-3">
                    	<div class="footer-div">
                        	<h3>Customer Services</h3>
                            <ul class="footer-ul">
                            	<li><a href="#">Contact Us</a></li>
                                <li><a href="#">Returns</a></li>
                                <li><a href="#">Site Map</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="col-md-3">
                    	<div class="footer-div">
                        	<h3>Extras</h3>
                            <ul class="footer-ul">
                            	<li><a href="#">Brands</a></li>
                                <li><a href="#">Gift Vouchers</a></li>
                                <li><a href="#">Affiliates</a></li>
                                <li><a href="#">Specials</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="col-md-3">
                    	<div class="footer-div">
                        	<h3>My Account</h3>
                            <ul class="footer-ul">
                            	<li><a href="#">My Account</a></li>
                                <li><a href="#">Order History</a></li>
                                <li><a href="#">Wish List</a></li>
                                <li><a href="#">Newsletter</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    <div class="container-fluid footer-bg2">
    		<div class="row">
                <div class="container">
                    <div class="row">
                        <div class="col-md-6">
                            <p class="copyright">© Copyright 2015. All Right Reserved.</p>
                        </div>
                        <div class="col-md-6">
                        	<ul class="social-link">
                            	<li><a href="#" class="s-icon fb-icon"></a></li>
                                <li><a href="#" class="s-icon gp-icon"></a></li>
                                <li><a href="#" class="s-icon pin-icon"></a></li>
                                <li><a href="#" class="s-icon yt-icon"></a></li>
                                <li><a href="#" class="s-icon tw-icon"></a></li>
                            </ul>
                        </div>
                    </div>
                </div>
        </div>
    </div>
</footer>
<script src="js/jquery.js" type="application/javascript"></script>
<script src="js/bootstrap.min.js" type="application/javascript"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/custom.js"></script>
</body>

</html>




@charset "utf-8";
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700,800);

/*================header css starts====================*/
body{ /*background:#f7f7f7*/ background:#fff;}
.header1{ background:#38383c; }
.bg-border{ border-bottom:1px solid #5c5c61;}
.topbar-ul{ padding:8px 0; margin-bottom:0; width:33%; text-align:right; float:right;}
.topbar-ul li{padding:0 18px;  border-right:1px solid #fff; line-height:14px; display:inline-block; vertical-align:top;}
.topbar-ul li a{ font-size:13px; color:#fff;  font-family: 'Open Sans', sans-serif !important; font-weight:300;}
.topbar-ul li a:hover{}
.topbar-ul li a span{ color:#44b8ff;}
.topbar-ul li:first{ padding-left:0 !important;}
.topbar-ul li:last-child{ padding-right:0 !important; border:none;}
.main-menu{ background:none; border:none;}
.main-menu .navbar-brand{padding: 12px 15px;}
.main-menu.navbar-default .navbar-nav > li > a{ padding-bottom:0; color: #fff; text-transform:uppercase; font-size:14px; font-family: 'Open Sans', sans-serif !important; font-weight:600;}
.main-menu .navbar-collapse{ padding:0; }
.main-menu.navbar-default .navbar-nav > li:last-child > a{ padding-right:0;}
.main-menu.navbar-default .navbar-nav{ margin-top:14px;}

/*================header css end====================*/

/*================middle body css start====================*/
.banner-slide{ border-bottom:1px solid #58585d;}
.banner-slide .carousel-control.left{ background:none;}
.banner-slide .carousel-control.right{ background:none;}
.b-caption{ float:left; left:9%;  width:28%; padding-bottom: 6%;text-align:left;}
.b-caption h4{color:#44b8ff; font-size:24px; font-family: 'Open Sans', sans-serif !important; font-weight:800; text-transform:uppercase;}
.b-caption p{ font-size:14px; margin-bottom:23px; color:#f7f7f7; font-family: 'Open Sans', sans-serif !important; font-weight:400;}
.btn-visit{ padding:12px 15px; border:1px solid #44b7fd; font-weight:400; font-size:14px; text-transform:uppercase; color:#44b7fd}
.btn-visit:hover{color:#44b7fd}
.banner-slide .item .container{ margin:auto;}
.icon-b img{ margin-top:20px;}
.icon-b{ display:block;}
.banner-slide .carousel-control{ width:42px;}
.banner-sect{ background:#38383c; padding-bottom:140px;}
.banner-slide .glyphicon-chevron-left:before{ content:'';}
.banner-slide .glyphicon-chevron-right:before{ content:'';}
.tp-box{ position:relative; background:#fff; width:100%; padding:16px 10px; height:153px; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; -o-border-radius:3px; -ms-border-radius:3px; box-shadow:0px 0px 2px #bcbcbc;}
.tp-box span{ text-align:left; color:#44b8ff; width:40%;  display:inline-block; vertical-align:middle; font-size:20px; font-family: 'Open Sans', sans-serif !important; font-weight:600;}
.tp-box img{}
.up-box{ margin-top:-86px; margin-bottom:10px;}
.last-tpbox img{ width:155px !important;}
.tp-box-img{ width:60%; display:inline-block; vertical-align:middle;}
.view-more-sales{ opacity:0; position:absolute; left:0; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; -o-border-radius:3px; -ms-border-radius:3px; top:0; height:153px; width:100%; background:url(../images/trans-bg.png);}
.view-more-sales a{ display:block; text-align:center; height:131px; margin:10px; border:1px solid #fff;}
.view-more-sales a span{ vertical-align:middle; color:#fff; font-size:14px; font-family: 'Open Sans', sans-serif !important; font-weight:600; text-transform:capitalize; padding:14px; border:1px solid #fff; margin-top:38px; text-align:center; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; -o-border-radius:3px; -ms-border-radius:3px;} 
.tp-box:hover .view-more-sales{opacity:1; transition:all 0.6s; -moz-transition:all 0.6s; -webkit-transition:all 0.6s; -o-transition:all 0.6s; -ms-transition:all 0.6s;}
.p-heading1{ color:#5c5c61; border-bottom:1px solid #5c5c61; padding-bottom:10px; font-size:20px; font-family: 'Open Sans', sans-serif !important; font-weight:600;}
.pr-slider .owl-carousel .item{ text-align:center;}
.item-h3{ text-align:center; color:#5c5c61; width:100%;  font-size:16px; font-family: 'Open Sans', sans-serif !important; font-weight:600;}
.pr-slider{ position:relative;  margin-top:80px; margin-bottom:80px;}
.product-slider .owl-buttons .owl-prev{ background:url(../images/left-arrow-product.png) center center no-repeat !important;}
.product-slider .owl-buttons .owl-next{background:url(../images/right-arrow-product.png) center center no-repeat !important}
.product-slider .owl-controls .owl-buttons{text-align:right !important;}
.product-slider .owl-controls .owl-buttons div{  border-radius:3px !important; -moz-border-radius:3px !important; -o-border-radius:3px !important; -webkit-border-radius:3px !important; -ms-border-radius:3px !important; color:transparent !important; padding:7px 7px !important; border:1px solid #5e5e63;}
.product-slider .owl-controls{top:-55px; margin:0 !important; position:absolute; right:0;}
.cart-btn{ width:100%; margin:20px 0 10px;}
.buy-btn{ padding:8px 0; width:103px; border:1px solid #44b8ff; border-radius:3px; -moz-border-radius:3px; -o-border-radius:3px; -webkit-border-radius:3px; -ms-border-radius:3px; font-size:14px; color:#5c5c61; font-family: 'Open Sans', sans-serif !important; font-weight:600;}
.buy-btn:hover{ background:#44b8ff; color:#fff;}
.product-slider .owl-wrapper{ margin-top:30px;}
/*===============product slider css==============*/
/* clearfix */
.owl-carousel .owl-wrapper:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
/* display none until init */
.owl-carousel{
	display: none;
	position: relative;
	width: 100%;
	-ms-touch-action: pan-y;
}
.owl-carousel .owl-wrapper{
	display: none;
	position: relative;
	-webkit-transform: translate3d(0px, 0px, 0px);
}
.owl-carousel .owl-wrapper-outer{
	overflow: hidden;
	position: relative;
	width: 100%;
}
.owl-carousel .owl-wrapper-outer.autoHeight{
	-webkit-transition: height 500ms ease-in-out;
	-moz-transition: height 500ms ease-in-out;
	-ms-transition: height 500ms ease-in-out;
	-o-transition: height 500ms ease-in-out;
	transition: height 500ms ease-in-out;
}
	
.owl-carousel .owl-item{
	float: left;
}
.owl-controls .owl-page,
.owl-controls .owl-buttons div{
	cursor: pointer;
}
.owl-controls {
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* mouse grab icon */
.grabbing { 
    cursor:url(grabbing.png) 8 8, move;
}

/* fix */
.owl-carousel  .owl-wrapper,
.owl-carousel  .owl-item{
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility:    hidden;
	-ms-backface-visibility:     hidden;
  -webkit-transform: translate3d(0,0,0);
  -moz-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
}

.owl-theme .owl-controls{
	margin-top: 10px;
	text-align: center;
}

/* Styling Next and Prev buttons */

.owl-theme .owl-controls .owl-buttons div{
	color: #FFF;
	display: inline-block;
	zoom: 1;
	*display: inline;/*IE7 life-saver */
	margin: 5px 3px;	
	font-size: 12px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border-radius: 30px;
	background: #869791;
}
/* Clickable class fix problem with hover on touch devices */
/* Use it for non-touch hover action */
.owl-theme .owl-controls.clickable .owl-buttons div:hover{
	filter: Alpha(Opacity=100);/*IE7 fix*/
	opacity: 1;
	text-decoration: none;
}

/* Styling Pagination*/

.owl-theme .owl-controls .owl-page{
	display: inline-block;
	zoom: 1;
	*display: inline;/*IE7 life-saver */
}
.owl-theme .owl-controls .owl-page span{
	display: block;
	width: 12px;
	height: 12px;
	margin: 5px 7px;
	filter: Alpha(Opacity=50);/*IE7 fix*/
	opacity: 0.5;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	background: #869791;
}

.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span{
	filter: Alpha(Opacity=100);/*IE7 fix*/
	opacity: 1;
}

/* If PaginationNumbers is true */

.owl-theme .owl-controls .owl-page span.owl-numbers{
	height: auto;
	width: auto;
	color: #FFF;
	padding: 2px 10px;
	font-size: 12px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border-radius: 30px;
}

/* preloading images */
.owl-item.loading{
	min-height: 150px;
	background: url(AjaxLoader.gif) no-repeat center center
}

/*===============product slider css==============*/

.fs-section{ background:url(../images/banner-section2-bg.png) no-repeat; padding-top:65px; padding-bottom:65px;}
.fs-heading1{ font-size:20px; color:#fff; margin:0 auto 20px;; font-family: 'Open Sans', sans-serif !important; text-transform:uppercase; text-align:center; font-weight:600;}
.fs-heading2{ font-size:14px; width:70%; margin:30px auto; line-height:20px; text-align:center; color:#fff; font-family: 'Open Sans', sans-serif !important; text-align:center; font-weight:400;}
.fs-div{ padding:10px;  border:2px solid #44b8ff; border-radius:3px; -moz-border-radius:3px; -o-border-radius:3px; -webkit-border-radius:3px; -ms-border-radius:3px;}
.fs-h3{ border:1px solid #87848a;}
.fs-h3 h3{ margin:55px 0; color:#fff; text-align:center; text-transform:uppercase; font-size:36px; font-family: 'Open Sans', sans-serif !important; font-weight:600;}
.fs-h3 h3 span{ color:#44b8ff}
.fs-h3 h3 small{ display:block; font-size:16px; color:#fff; margin-top:2px; font-family: 'Open Sans', sans-serif !important; font-weight:600;}

/*================middle body css end====================*/
/*================footer css start====================*/
.footer-bg1{ background:#5c5c61;}
.footer-bg2{ background:#38383c;}
.footer-div{ width:100%;}
.footer-div h3{ background:#38383c; padding:10px 25px; font-size:20px; font-family: 'Open Sans', sans-serif !important; font-weight:600; color:#44b8ff;}
.footer-ul{ padding-left:25px; margin-top:30px; margin-bottom:20px; }
.footer-ul li{ list-style:none; margin:6px 0;}
.footer-ul li a{ color:#b5b5b9; font-size:14px; font-family: 'Open Sans', sans-serif !important; font-weight:400;}
.footer-ul li a:hover{ text-decoration:none;}
.copyright{ padding:22px 20px; margin:0;   color:#b5b5b9; font-size:14px; font-family: 'Open Sans', sans-serif !important; font-weight:400;}
.social-link{ margin-top:14px; margin-bottom:0; text-align:right; padding:0;}
.social-link li{ display:inline-block; width:45px; height:40px;}
.s-icon{ background:url(../images/social-icons.png) no-repeat !important; width:37px; height:40px; display:block;}
.fb-icon{ background-position:0 0;}
.gp-icon{background-position:-37px 0px !important;}
.pin-icon{background-position:-74px 0px !important;}
.yt-icon{background-position:-113px 0px !important;}
.tw-icon{background-position:-150px 0px !important;}
/*================footer css start====================*/