The Stunnin Style Guide for BentoGo
BentoGo delivers fresh and elaborately arranged boxed lunches that fit to your taste. Our lunches come in a variety of different designs, including characters from popular cartoons, movies, and video games.
BentoGo delivers fresh and elaborately arranged boxed lunches that fit to your taste. Our lunches come in a variety of different designs, including characters from popular cartoons, movies, and video games.
<button>Button</button>
<a class="button" href="#">Link button</a>
<button type="submit">Submit Submit</a>
<input type="button" value="Input button">
<input type="submit" value="Input submit button">
Link button
<button class="button-red">Red Button</button>
<button class="button-orange">Orange Button</button>
<button class="button-yellow">Yellow Button</button>
<a href="#" class="button">Nav Button</a>
Nav Button
<a href="#">In-text link</a>
This is an In-text link
<div class="breadcrumbBar">
<a class="breadcrumb-item" href="#">Home </a>
<p class="breadcrumb-item">/</p>
<a class="breadcrumb-item" href="#">Premade Bentos </a>
<p class="breadcrumb-item">/</p>
<a class="breadcrumb-item" href="#">Pikachu Bento </a>
</div>
<form> COMMENT: <input type="text" placeholder="Leave a comment"> </form>
<form> <input type="search" placeholder="Search"> </form>
<select>
<option value="pokemon">Pokemon</option>
<option value="mario">mario</option>
<option value="sanrio">sanrio</option>
<option value="cardcaptors">cardcaptors</option>
</select>
<div class="checkbox">
<input id="option1" type="checkbox" class="checkbox">
<label for="option1">Option1</label>
</div>
<div class="checkbox">
<input id="option2" type="checkbox" class="checkbox">
<label for="option2">Option2</label>
</div>
<div class="checkbox">
<input id="option3" type="checkbox" class="checkbox">
<label for="option3">Option3</label>
</div>
<h1>Fresh and elaborately arranged lunches</h1>
<h2>Fresh and elaborately arranged lunches</h2>
<h3>Fresh and elaborately arranged lunches</h3>
<h4>Fresh and elaborately arranged lunches</h4>
<h5>Fresh and elaborately arranged lunches</h5>
<h6>Fresh and elaborately arranged lunches</h6>
<p>
BentoGo delivers fresh and elaborately arranged boxed lunches that fit to your taste.
</p>
BentoGo delivers fresh and elaborately arranged boxed lunches that fit to your taste. Our lunches come in a variety of different designs, including characters from popular cartoons, movies, and video games. At BentoGo, we understand the joy of preparing and receiving a homemade lunch box, and we want to recreate this with you. From cooked meals to treats of all sorts - we’ve got you covered. Our delivery folks bring your order to you, whether that’s at home, at the office, or wherever else you may want a bento box.
<ul>
<li>Pikachu Bento</li>
<li>Jigglypuff Bento</li>
<li>Mewtwo Bento</li>
</ul>
<ol>
<li>Pikachu Bento</li>
<li>Jigglypuff Bento</li>
<li>Mewtwo Bento</li>
</ol>
<div class="slab-gray">This is one sentence in a gray slab.</div>
BentoGo delivers fresh and elaborately arranged boxed lunches that fit to your taste. Our lunches come in a variety of different designs, including characters from popular cartoons, movies, and video games.
<div class="slab-ketchup-red">This is one sentence in a ketchup red slab.</div>
BentoGo delivers fresh and elaborately arranged boxed lunches that fit to your taste. Our lunches come in a variety of different designs, including characters from popular cartoons, movies, and video games.
<nav class="nav-main-wrap">
<ul class="nav-main">
<li class="logo">
<a href="Home.html>
<img id="tako" src="img/Tako.png" alt="Bentogo's mascot, Tako the Octopus">
</a>
</li>
<li class="hamburger">
<a href="javascript:void(0);" onclick="toggleHamburger()">
<img src="img/icon-hamburger.png" alt="hamburger icon"></a>
</li>
<li><a class="button-nav" href="ShopPremade.html">Bentos</a></li>
<li><a class="button-nav" href="Customize-Step1.html">Customize</a></li>
<li><a class="button-nav" href="Contact.html">Contact</a></li>
<li class="cart-nav">
<a class="button-nav" id="myCart" href="MyCart.html">My Cart</a>
<img id="icon-cart" src="img/icon-cart.png" alt="icon cart">
</li>
</ul>
</nav>
<div class="menu-horizontal">
<ul>
<li> <a href="#Character">1. Character</a></li>
<li> <a href="#Filling">2. Filling</a></li>
<li> <a href="#Sides">3. Sides</a></li>
<li> <a href="#Rice">4. Rice</a></li>
<li> <a href="#Sauces">5. Sauces</a></li>
<li> <a href="#Confirm">6. Confirm</a></li>
<ul>
</div>
<div class="row">
<div class="grid-1-3">
<img src=""/>
<span class="caption">
<a href="#">Pikachu Box </a>
<p>$9.95</p>
<a class="button-addToCart" href=" ">Add to Cart</a>
</span>
</div>
</div>
<section id="shortForm">
<div class="row">
<div class="grid-1-1">
<div id="contactForm">
<form method="post" action="#">
<div class="grid-1-2">
<input type="text" id="contact-name" placeholder="Your Name">
</div>
<div class="grid-1-2">
<input type="text" id="contact-title" placeholder="Title of Comment">
</div>
<div class="grid-1-1">
<input type="email" id="contact-email" placeholder="Email">
</div>
<div class="grid-1-1">
<textarea id="contact-comment" placeholder="Leave any comments, concerns, and/or confessions of love here!"></textarea>
</div>
</form>
<div class ="rightAlign">
<input type="submit" value="Submit">
</div>
</div>
</div>
</div>
</section>