biobulkbende.org/app/index.html
2020-10-09 14:48:01 +02:00

195 lines
8.4 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Bio Bulk Bende</title>
<meta name="keywords" content="Bio, Bulk, Bende, Organic, Autonomous Foodcoop, Food, Cooperative">
<meta name="description" content="Bio Bulk Bende is an autonomous organic food cooperative .">
<link href='https://fonts.googleapis.com/css?family=Roboto:400,100,300,500,700' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="./temp/styles/style.css">
<!-- build:js assets/scripts/Vendor.js -->
<script type="text/javascript" src="./temp/scripts/Vendor.js"></script>
<!-- endbuild -->
</head>
<body>
<!-- HEADER -->
<header class="site-header">
<div class="wrapper">
<div class="site-header__logo">
<img src="./assets/media/images/bbb_logo_white.png" alt="BBB logo">
</div>
<div class="site-header__menu-icon">
<div class="site-header__menu-icon__middle"></div>
</div>
<div class="site-header__menu-content">
<div class="site-header__btn-container">
<a href="#" class="btn ">Place your Order</a>
</div>
<div class="site-header__language">
<a href="#"><img src="./assets/media/images/netherlands_flag.gif" alt="Netherlands flag"></a>
</div>
<nav class="primary-nav primary-nav--pull-right">
<ul>
<li><a href="#about-us">About us</a></li>
<li><a href="#how-it-works">How it works</a></li>
<li><a href="#agenda">Agenda</a></li>
<li><a href="#members-area">Members area</a>
</ul>
</nav>
</div>
</div>
</header>
<!-- STARTING SECTION -->
<div class="large-hero">
<picture>
<source srcset="./assets/media/images/veg_large.png 1920w" media="(min-width: 1380px)">
<source srcset="./assets/media/images/veg_medium.png 1380w" media="(min-width: 990px)">
<source srcset="./assets/media/images/veg_small.png 990w" media="(min-width: 640px)">
<img srcset="./assets/media/images/boxes_small.jpg 640w" alt="Our fresh vegetables" class="large-hero__image">
</picture>
<div class="large-hero__text-content">
<h1 class="large-hero__title">bio bulke bende</h1>
<h2 class="large-hero__subtitle">The organic autonomous foodcoop <br> of Rotterdam</h2>
<!-- <p class="large-hero__description">Good quality, delicious food from local suppliers and farmers. Located in Almondestraat 157, <b>bio bulk bende</b> is the first food co-op in Rotterdam. </p> -->
<p><a href="#" class="btn btn--large">Join us!</a></p>
</div>
</div>
<!-- ABOUT US -->
<div id="about-us" class="page-section page-section--red page-section--b-margin page-section--tb-padding">
<div class="wrapper">
<div class="headline headline--s-width headline--centered headline--b-margin">
<h2 class="headline__title ">We started the coop in the summer of 2019...</h2>
<h2 class="headline__subtitle">...because we wanted to be able to get good quality, delicious food from local suppliers and farmers. Inspired by the Amsterdam food co-op <a href="#">Vokomokum</a>, we decided to start our own.</h2>
</div>
<div class="row row--gutters">
<div class="row__medium-8">
<div class="video-container">
<video class="content--video--right" width="560" height="315" controls>
<source src="./assets/media/videos/bbb_video.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
</div>
</div>
<div class="row__medium-4">
<div class="generic-content-container generic-content-container--t-b-margin generic-content-container--t-center">
<a href="#" class="btn btn--medium">Join us!</a>
<p>We are happy to have new members at the moment. Join us now or simply drop by on our next pickup day and say hello! </p>
<div class="page-section--arrow-down"></div>
</div>
</div>
</div>
</div>
</div>
<!-- HOW IT WORKS -->
<div id="how-it-works" class="page-section page-section--darkGreen page-section--tb-padding">
<div class="wrapper wrapper--t-margins">
<div class="row row--gutters">
<div class="row__medium-3--larger">
<img class="how-it-works__icon how-it-works__icon--foodcoop" src="./assets/media/images/foodcoop.png">
</div>
<div class="row__medium-9--smaller">
<div class="headline headline--lt-margin">
<h2 class="headline__title ">What is a <strong>foodcoop?</strong></h2>
<h2 class="headline__subtitle">A co-op is a collective where everyone shares the workload for the benefit of the whole. A food co-op is a group of people that buy food from suppliers of their own choosing. <br> A collective do-it-yourself supermarket.</h2>
</div>
</div>
</div>
</div>
</div>
<div id="how-it-works-2" class="page-section page-section--lightGreen page-section--t-padding page-section--b-padding-small">
<div class="wrapper">
<div class="how-it-works">
<div class="row row--gutters">
<div class="row__medium-6">
<img src="./assets/media/images/pickup_day_short.png">
</div>
<div class="row__medium-6">
<h2 class="how-it-works__title"><img class="how-it-works__icon how-it-works__icon--foodcoop2" src="./assets/media/images/foodcoop.png"> Become a <strong>Member</strong> </h2>
<p>If youre a member of our BioBulkBende, you have access to great organic food, straight from the producers, at lower prices than in the supermarket. In return, you pay a one-time non-refundable membership fee of 15 euros, and contribute a bit of your time and energy to keep our co-op running.</p>
</div>
</div>
</div>
<div class="how-it-works">
<div class="row row--gutters">
<div class="row__medium-6">
<h2 class="how-it-works__title"><img class="how-it-works__icon how-it-works__icon--foodcoop2" src="./assets/media/images/foodcoop.png"> Join a <strong>Work Group</strong> </h2>
<p>A work group is a group of members who work together and are responsible for a specific need of our food co-op. Some examples of work groups are administration, membership, orders, financial, etc. As a member of our food co-op, you have to join a work group.</p>
</div>
<div class="row__medium-6">
<img src="./assets/media/images/pickup_day_short.png">
</div>
</div>
</div>
<div class="how-it-works">
<div class="row row--gutters">
<div class="row__medium-6">
<img src="./assets/media/images/pickup_day_short.png">
</div>
<div class="row__medium-6">
<h2 class="how-it-works__title"><img class="how-it-works__icon how-it-works__icon--foodcoop2" src="./assets/media/images/foodcoop.png"> Order your <strong>Food</strong> </h2>
<p>Only members can place an order, but anyone can become a member! For food ordering, we use Foodsoft. You can learn more about how to order by joining us at any upcoming pickup day.</p>
</div>
</div>
</div>
</div>
</div>
<div >
</div>
<div id="how-it-works-3" class="page-section">
<picture>
<source srcset="./assets/media/images/veg_large_cropped.png 1920w" media="(min-width: 1380px)">
<source srcset="./assets/media/images/veg_medium.png 1380w" media="(min-width: 990px)">
<source srcset="./assets/media/images/veg_small.png 990w" media="(min-width: 640px)">
<img srcset="./assets/media/images/boxes_small.jpg 640w" alt="Our fresh vegetables" class="large-hero__image">
</picture>
<div class="how-it-works">
<div class="how-it-works--centered how-it-works--t-margin">
<div class="wrapper wrapper--white wrapper--medium">
<div class="how-it-works__last-section">
<div class="wrapper wrapper--small">
<h2 class="how-it-works__title"><img class="how-it-works__icon how-it-works__icon--foodcoop2" src="./assets/media/images/foodcoop.png"><strong>Pick-up day</strong></h2>
<p>Only members can place an order, but anyone can become a member! For food ordering, we use Foodsoft. You can learn more about how to order by joining us at any upcoming pickup day.</p>
<p><a href="#" class="btn btn--large"><b>Join us!</b></a></p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- AGENDA -->
<!-- MEMBERS -->
<!-- FOOTER -->
<footer>
<p><span class="site-footer__text">Copyright &copy; 2020 Bio Bulke Bende. All rights reserved.</span> <a href="#" class="btn">Join us!</a></p>
</footer>
<!-- MODAL -->
<!-- build:js assets/scripts/App.js -->
<script type="text/javascript" src="./temp/scripts/App.js"></script>
<!-- endbuild -->
</body>
</html>