<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>BigBrew</title>
<link rel="stylesheet" href="https://unpkg.com/swiper@7/swiper-bundle.min.css" />
<!-- font awesome cdn link -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
<!-- custom css file link -->
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<!-- header section starts -->
<header class="header">
<div id="menu-btn" class="fas fa-bars"></div>
<a href="#" class="logo"> BigBrew <img src="image_1/logo_itona.jpg" alt="BigBrew Logo"> </a>
<nav class="navbar">
<a href="#home">home</a>
<a href="#about">about</a>
<a href="#menu">menu</a>
<a href="#review">review</a>
<a href="#book">order</a>
</nav>
<a href="#" class="btn">Front Page</a>
</header>
<!-- header section ends -->
<!-- home section starts -->
<section class="home" id="home">
<div class="row">
<div class="content">
<h3 style="color: white;">Refreshing Drinks for you</h3>
<a href="#" class="btn">buy now</a>
</div>
<div class="image">
<img src="image_1/milktea.png" class="main-home-image" alt="">
</div>
</div>
<div class="image-slider">
<img src="image_1/milktea.png" alt="">
<img src="image_1/coffee.png" alt="">
<img src="image_1/praff.png" alt="">
<img src="image_1/Fruittea.png" alt="">
<img src="image_1/Kape.png" alt="">
</div>
</section>
<!-- home section ends -->
<!-- about section starts -->
<section class="about" id="about">
<h1 class="heading"> About us </h1>
<div class="row">
<div class="image">
<img src="image_1/BSIS3B.png">
</div>
<div class="content">
<h3 class="title">Know more about us</h3>
<p>BigBrew is a dynamic and innovative beverage company dedicated to crafting exeptional, high-quality brews. With a passion for flavor and commitment to sustainability, we blend tradition with modern techniques to deliver a diverse range of beverages that captivate the senses. <br> At Bigbrew our mission is to elevate your drinking experience, one sip at a time.</p>
<a href="#" class="btn">read more</a>
<div class="icons-container">
<div class="icons">
<img src="image/about-icon-1.png" alt="">
<h3>quality Drinks</h3>
</div>
<div class="icons">
<img src="image/about-icon-2.png" alt="">
<h3>our branches</h3>
</div>
<div class="icons">
<img src="image/about-icon-3.png" alt="">
<h3>free delivery</h3>
</div>
</div>
</div>
</div>
</section>
<!-- about section ends -->
<!-- menu section starts -->
<section class="menu" id="menu">
<h1 class="heading"> Drinks Menu </h1>
<div class="box-container">
<a href="#" class="box">
<img src="image_1/milktea.png" alt="">
<div class="content">
<h3>Milk Tea</h3>
<p>Sip, savor, and indulge in the delightful world of Milktea bliss.</p>
<span>See all flavours.</span>
</div>
</a>
<a href="#" class="box">
<img src="image_1/coffee.png" alt="">
<div class="content">
<h3>Hot Coffee</h3>
<p>Embrace the warmth of the perfect moment with a steaming cup of rich and comforting hot coffee.</p>
<span>See all flavours.</span>
</div>
</a>
<a href="#" class="box">
<img src="image_1/Fruittea.png" alt="">
<div class="content">
<h3>Fruit Tea</h3>
<p>Elevate your taste buds with the refreshing burst of flavours in every sip of fruit tea.</p>
<span>See all flavours.</span>
</div>
</a>
<a href="#" class="box">
<img src="image_1/Kape.png" alt="">
<div class="content">
<h3>Iced Coffee</h3>
<p>Chill out and awaken your senses with the invigrating kick of iced coffee perfection.</p>
<span>See all flavours.</span>
</div>
</a>
<a href="#" class="box">
<img src="image_1/praff.png" alt="">
<div class="content">
<h3>Praf</h3>
<p>Indulge in the creamy delight of Praf - a heavenly milkshake crowned with luscious whipped cream.</p>
<span>See all flavours.</span>
</div>
</a>
<a href="#" class="box">
<img src="image_1/Add.png" alt="">
<div class="content">
<h3>Add ons</h3>
<p>Transform your beverage into a symphony of flavours with our irresistible add-ons, elevating every sip into a personalized experience.</p>
<span>See all.</span>
</div>
</a>
</div>
</section>
<!-- menu section ends -->
<!-- review section starts -->
<section class="review" id="review">
<h1 class="heading"> reviews </h1>
<div class="swiper review-slider">
<div class="swiper-wrapper">
<div class="swiper-slide box">
<i class="fas fa-quote-left"></i>
<i class="fas fa-quote-right"></i>
<img src="image_1/Pogi_ng_IS.jpg" alt="">
<div class="stars">
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
</div>
<p>Masarap at refreshing ang drinks dito.</p>
<h3>Earlybird</h3>
<span>satisfied client</span>
</div>
<div class="swiper-slide box">
<i class="fas fa-quote-left"></i>
<i class="fas fa-quote-right"></i>
<img src="image_1/Lynsey.jpg" alt="">
<div class="stars">
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
</div>
<p>Tumawid ako sa highway tapos nakita ko siya. Ayon ang sarap nung milktea.</p>
<h3>miles_awayyy</h3>
<span>satisfied client</span>
</div>
<div class="swiper-slide box">
<i class="fas fa-quote-left"></i>
<i class="fas fa-quote-right"></i>
<img src="image_1/sisters.jpg" alt="">
<div class="stars">
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
</div>
<p>Nakakarefresh! BigBrew is da best!.</p>
<h3>mimongiii</h3>
<span>satisfied client</span>
</div>
<div class="swiper-slide box">
<i class="fas fa-quote-left"></i>
<i class="fas fa-quote-right"></i>
<img src="image_1/Hari.jpg" alt="">
<div class="stars">
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
</div>
<p>Malinamnam Pamparampampam :P.</p>
<h3>hari_mo</h3>
<span>satisfied client</span>
</div>
<div class="swiper-slide box">
<i class="fas fa-quote-left"></i>
<i class="fas fa-quote-right"></i>
<img src="image_1/Marie.jpg" alt="">
<div class="stars">
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
</div>
<p>Aking sinipsip mata koy tumirik. Hmmm sarap!!</p>
<h3>Araw_gabi_no_pants</h3>
<span>satisfied client</span>
</div>
</div>
<div class="swiper-pagination"></div>
</div>
</section>
<!-- review section ends -->
<!-- book section starts -->
<section class="book" id="book">
<h1 class="heading"> Order Now </h1>
<form action="">
<input type="text" placeholder="Name" class="box">
<input type="text" placeholder="Address" class="box">
<input type="number" placeholder="Number" class="box">
<textarea name="" placeholder="Type of Drink/Drinks" class="box" id="" cols="30" rows="10"></textarea>
<input type="submit" value="Place order" class="btn">
</form>
</section>
<!-- book section ends -->
<!-- footer section starts -->
<section class="footer">
<div class="box-container">
<div class="box">
<h3>our branches</h3>
<a href="#"> <i class="fas fa-arrow-right"></i> Tanza, Boac, Marinduque </a>
<a href="#"> <i class="fas fa-arrow-right"></i> Poblacion, Torrijos, Marinduque </a>
<a href="#"> <i class="fas fa-arrow-right"></i> Bangbang, Gasan, Marinduque </a>
<a href="#"> <i class="fas fa-arrow-right"></i> Banahaw, Sta.Cruz, Marinduque </a>
<a href="#"> <i class="fas fa-arrow-right"></i> Tungi-Lipata, Buenavista, Marinduque </a>
</div>
<div class="box">
<h3>quick links</h3>
<a href="#"> <i class="fas fa-arrow-right"></i> home </a>
<a href="#"> <i class="fas fa-arrow-right"></i> about </a>
<a href="#"> <i class="fas fa-arrow-right"></i> menu </a>
<a href="#"> <i class="fas fa-arrow-right"></i> review </a>
<a href="#"> <i class="fas fa-arrow-right"></i> book </a>
</div>
<div class="box">
<h3>contact info</h3>
<a href="#"> <i class="fas fa-phone"></i> +123-456-7890 </a>
<a href="#"> <i class="fas fa-phone"></i> +111-222-3333 </a>
<a href="#"> <i class="fas fa-envelope"></i> Bigbrew@gmail.com </a>
<a href="#"> <i class="fas fa-envelope"></i> Marinduque, Philippines </a>
</div>
<div class="box">
<h3>contact info</h3>
<a href="https://web.facebook.com/bigbrew.main"> <i class="fab fa-facebook-f"></i> facebook </a>
<a href="#"> <i class="fab fa-twitter"></i> twitter </a>
<a href="#"> <i class="fab fa-twitter"></i> twitter </a>
<a href="#"> <i class="fab fa-instagram"></i> instagram </a>
<a href="#"> <i class="fab fa-linkedin"></i> linkedin </a>
</div>
</div>
<div class="credit"> Project of BSIS-3B </div>
</section>
<!-- footer section ends -->
<script src="https://unpkg.com/swiper@7/swiper-bundle.min.js"></script>
<!-- custom js file link -->
<script src="js/script.js"></script>
</body>
</html>