File size: 17.44Kb
<!--
Author: W3layouts
Author URL: http://w3layouts.com
-->
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Bio Crop a Agriculture Category Responsive Web Template | Home :: W3layouts</title>
<!-- Template CSS -->
<link rel="stylesheet" href="assets/css/style-starter.css">
<link href="https://fonts.googleapis.com/css?family=Karla:400,700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Karla&display=swap" rel="stylesheet">
</head>
<body id="home">
<section class=" w3l-header-4 header-sticky">
<header class="absolute-top">
<div class="container">
<nav class="navbar navbar-expand-lg navbar-light">
<h1><a class="navbar-brand" href="index.html"> <span class="fa fa-pagelines" aria-hidden="true"></span>
Bio Crop
</a></h1>
<button class="navbar-toggler bg-gradient collapsed" type="button" data-toggle="collapse"
data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false"
aria-label="Toggle navigation">
<span class="fa icon-expand fa-bars"></span>
<span class="fa icon-close fa-times"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="index.html">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="about.html">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html">Services</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Contact</a>
</li>
</ul>
<a href="#" class="ml-lg-3 mt-lg-0 mt-3 book btn btn-style">Get started</a>
</div>
</div>
</nav>
</div>
</header>
</section>
<script src="assets/js/jquery-3.3.1.min.js"></script> <!-- Common jquery plugin -->
<!--bootstrap working-->
<script src="assets/js/bootstrap.min.js"></script>
<!-- //bootstrap working-->
<!-- disable body scroll which navbar is in active -->
<script>
$(function () {
$('.navbar-toggler').click(function () {
$('body').toggleClass('noscroll');
})
});
</script>
<!-- disable body scroll which navbar is in active -->
<section class="w3l-main-slider" id="home">
<!-- main-slider -->
<div class="companies20-content">
<div class="owl-one owl-carousel owl-theme">
<div class="item">
<li>
<div class="slider-info banner-view bg bg2" data-selector=".bg.bg2">
<div class="banner-info">
<div class="container">
<div class="banner-info-bg mr-auto">
<h5>Vegetables and Fruits Good For Health</h5>
<p>Conse ctetur Lorem ipsum dolor sit amet adipi sicing elit. Quae, velit recu sandae eum necessi tatibus bland itiis</p>
<a class="btn btn-theme2 mt-md-5 mt-4" href="contact.html"> Contact Us</a>
</div>
</div>
</div>
</div>
</li>
</div>
<div class="item">
<li>
<div class="slider-info banner-view banner-top1 bg bg2" data-selector=".bg.bg2">
<div class="banner-info">
<div class="container">
<div class="banner-info-bg mr-auto">
<h5>Vegetables and Fruits Good For Health</h5>
<p>Conse ctetur Lorem ipsum dolor sit amet adipi sicing elit. Quae, velit recu sandae eum necessi tatibus bland itiis</p>
<a class="btn btn-theme2 mt-md-5 mt-4" href="contact.html"> Contact Us</a>
</div>
</div>
</div>
</div>
</li>
</div>
</div>
</div>
<script src="assets/js/owl.carousel.js"></script>
<!-- script for -->
<script>
$(document).ready(function () {
$('.owl-one').owlCarousel({
loop: true,
margin: 0,
nav: false,
responsiveClass: true,
autoplay: false,
autoplayTimeout: 5000,
autoplaySpeed: 1000,
autoplayHoverPause: false,
responsive: {
0: {
items: 1,
nav: false
},
480: {
items: 1,
nav: false
},
667: {
items: 1,
nav: true
},
1000: {
items: 1,
nav: true
}
}
})
})
</script>
<!-- //script -->
<!-- /main-slider -->
</section>
<section class="w3l-covers-18">
<div class="covers-main editContent">
<div class="container">
<div class="gallery-image row">
<div class="column color-2 editContentc col-lg-4 ">
<div>
<h4 class=" editContent">Experience the real agriculture</h4>
<p class="para editContent">Assumenda temporibus quidem ipsam. Voluptate fuga corporis iusto similique voluptates sint quibu sdamAss umenda temporibus quidem ipsam. Voluptate fuga corporis iusto similique voluptates sint quibusdam.</p>
<a href="about.html" class="action-button btn mt-3">Read more</a>
</div>
</div>
<div class="img-box col-lg-4 col-md-6">
<img src="assets/images/5.jpg" alt="product" class="img-responsive ">
<h5 class="my-2"><a href="about.html">Our Mission</a></h5>
<p class="para">Lorem ipsum dolor sit amet consectetur adipisicing elit. Eveniet itaque labor.</p>
</div>
<div class="img-box col-lg-4 col-md-6">
<img src="assets/images/6.jpg" alt="product" class="img-responsive ">
<h5 class="my-2"><a href="about.html">Our Vision</a></h5>
<p class="para">Lorem ipsum dolor sit amet consectetur adipisicing elit. Eveniet itaque labor.</p>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="w3l-teams-15">
<div class="team-single-main editContent">
<div class="container">
<div class="row">
<div class="column2 image-text col-xl-6">
<h3 class="team-head editContent">Organic Food - Farm Fresh Produce Right To Your Door</h3>
<div class="team-two">
<div class="nature-row">
<h5><a href="#page">
Fresh Vegetable</a></h5>
<p class="para editContent text ">
Mollitia placeat modi explicabo voluptatum corporis unde Dicta, provident
Rem adipisci Mollitia placeat modi explicabo.</p>
</div>
<div class="nature-row">
<h5><a href="#page">
Fresh Fruits</a></h5>
<p class="para editContent text ">
Mollitia placeat modi explicabo voluptatum corporis unde Dicta, provident
Rem adipisci Mollitia placeat modi explicabo.</p>
</div>
</div>
</div>
<div class="column2 image-text col-xl-6">
<img src="assets/images/b1.jpg" alt="product" class="img-responsive ">
</div>
</div>
</div>
</div>
</div>
</section>
<section class="w3l-call-to-action_9">
<div class="call-w3 editContent">
<div class="container">
<div class="grids">
<div class="grids-content row text-center">
<div class="column col-lg-4 col-md-6 col-sm-6 back-image editContent p-sm-0">
<img src="assets/images/5.jpg" alt="product" class="img-responsive rounded-0">
</div>
<div class="column col-lg-4 col-md-6 col-sm-6 color-2 editContent">
<div>
<h4><a href="about.html" class=" editContent">Cultivating</a></h4>
<p class="para editContent">Assumenda temporibus quidem ipsam. Voluptate fuga corporis iusto similique voluptates sint quibusdam.</p>
</div>
</div>
<div class="column col-lg-4 col-md-6 col-sm-6 back-image2 editContent p-sm-0">
<img src="assets/images/6.jpg" alt="product" class="img-responsive rounded-0 ">
</div>
<div class="column col-lg-4 col-md-6 col-sm-6 color-2 editContent">
<div>
<h4><a href="about.html" class=" editContent">Wheat Cultivation</a></h4>
<p class="para editContent">Assumenda temporibus quidem ipsam. Voluptate fuga corporis iusto similique voluptates sint quibusdam.</p>
</div>
</div>
<div class="column col-lg-4 col-md-6 col-sm-6 back-image editContent p-sm-0">
<img src="assets/images/7.jpg" alt="product" class="img-responsive rounded-0">
</div>
<div class="column col-lg-4 col-md-6 col-sm-6 color-2 editContent">
<div>
<h4><a href="about.html" class=" editContent">Natural Products</a></h4>
<p class="para editContent">Assumenda temporibus quidem ipsam. Voluptate fuga corporis iusto similique voluptates sint quibusdam.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="w3l-clients" id="client">
<div class="main-w3">
<div class="container">
<!-- main-slider -->
<div class="main-slider row">
<div class="slider-info col-lg-4 col-md-6">
<div class="d-grid hh14-text">
<div class="hh14-info">
<p class="para">Conse ctetur adipis icing Lorem ipsum dolor sit amet,elit, sed do
eiusmod tempor incid idunt ut labore et dolore magna aliqua. enim
minim incid idunt ut labore et dolore magna aliqu. </p>
<div class="client-name">
<img src="assets/images/c1.jpg" alt="product" class="img-responsive ">
<h5>Jack Willson</h5>
</div>
</div>
</div>
</div>
<div class="slider-info col-lg-4 col-md-6">
<div class="d-grid hh14-text">
<div class="hh14-info">
<p class="para">Conse ctetur adipis icing Lorem ipsum dolor sit amet,elit, sed do
eiusmod tempor incid idunt ut labore et dolore magna aliqua. enim
minim incid idunt ut labore et dolore magna aliqu. </p>
<div class="client-name">
<img src="assets/images/c2.jpg" alt="product" class="img-responsive ">
<h5>Nike samson</h5>
</div>
</div>
</div>
</div>
<div class="slider-info col-lg-4 col-md-6">
<div class="d-grid hh14-text">
<div class="hh14-info">
<p class="para">Conse ctetur adipis icing Lorem ipsum dolor sit amet,elit, sed do
eiusmod tempor incid idunt ut labore et dolore magna aliqua. enim
minim incid idunt ut labore et dolore magna aliqu. </p>
<div class="client-name">
<img src="assets/images/c3.jpg" alt="product" class="img-responsive ">
<h5>Milky Deo</h5>
</div>
</div>
</div>
</div>
</div>
<!-- /main-slider -->
</div>
</div>
</section>
<section class="w3l-specification-6">
<div class="specification-layout editContent">
<div class="container">
<div class=" row">
<div class="col-xl-6 back-image">
<img src="assets/images/b1.jpg" alt="product" class="img-responsive ">
</div>
<div class="col-xl-6 about-right-faq align-self">
<h3 class="title-big"><a href="about.html">Fruitant market - Fruits, Vegetables & organic foods</a></h3>
<div class="call-grids-w3 d-grid">
<div class="grids-1 grids-effect">
<a href="#more"><span class="fa fa-pagelines"></span></a>
<h4><a href="#feature" class="title-head">Fruits and Vegetables</a></h4>
<p class="para">Vivamus a ligula quam. Duis feugiat tortor sed Ut blandit. Duis feugiat tortor sed.</p>
</div>
<div class="grids-1 grids-effect-2">
<a href="#more"><span class="fa fa-apple"></span></a>
<h4><a href="#feature" class="title-head">Organic and Natural</a></h4>
<p class="para">Vivamus a ligula quam. Duis feugiat tortor sed Ut blandit. Duis feugiat tortor sed.</p>
</div>
</div>
</div>
</section>
<section class="w3l-footer-29-main">
<div class="footer-29 py-5">
<div class="container">
<div class="row footer-top-29">
<div class="col-lg-5 col-md-5 col-sm-6 footer-list-29 footer-1">
<div class="left-side">
<h2><a href="index.html" class="footer-logo">Bio Crop</a></h2>
<p class="para">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Saepe qui repellat nam vero consectetur dicta eos suscipit. Numquam at minus architecto asperiores cupiditate. At molestias laborum voluptatibus numquam aperiam in.</p>
</div>
</div>
<div class="col-lg-3 col-md-3 col-sm-6 footer-list-29 footer-2 ">
<ul>
<h6 class="footer-title-29">Useful Links</h6>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="contact.html">Contact us</a></li>
</ul>
</div>
<div class="col-lg-4 col-md-4 col-sm-6 footer-list-29 footer-3">
<h6 class="footer-title-29">Latest from blog</h6>
<div class="footer-post mb-3">
<a href="#page">
<img src="assets/images/f1.jpg" class="img-responsive" alt=""></a>
<div>
<a href="#page">How to Eat Organic Foods</a>
<p class="small"><span class="fa fa-clock-o"></span> March 9, 2020</p>
</div>
</div>
<div class="footer-post">
<a href="#page">
<img src="assets/images/f2.jpg" class="img-responsive" alt="">
</a>
<div>
<a href="#page">How to Eat Organic Foods</a>
<p class="small"><span class="fa fa-clock-o"></span> March 9, 2020</p>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="w3l-footer-29-main w3l-copyright">
<div class="container">
<div class=" bottom-copies text-center">
<p class="copy-footer-29">© 2020 Bio Crop. All rights reserved | Designed by <a href="https://w3layouts.com">W3layouts</a></p>
</div>
</div>
</section>
<!-- move top -->
<button onclick="topFunction()" id="movetop" title="Go to top">
<span class="fa fa-long-arrow-up"></span>
</button>
<script>
// When the user scrolls down 20px from the top of the document, show the button
window.onscroll = function () {
scrollFunction()
};
function scrollFunction() {
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
document.getElementById("movetop").style.display = "block";
} else {
document.getElementById("movetop").style.display = "none";
}
}
// When the user clicks on the button, scroll to the top of the document
function topFunction() {
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
}
</script>
<!-- /move top -->
</body>
</html>