<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>about</title>
	<!--swiper css(hardware accelerated transitions)-->
	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@10/swiper-bundle.min.css"/>

	<!--font awesome link-->
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">

	<!--css file link-->
	<link rel="stylesheet" href="css/style.css">

</head>
<body>
	<!--header section-->
	<section class="header">

		<a href="home.php" class="logo">zuru kenya.</a>

		<nav class="navbar">
			<a href="home.php">home</a>
			<a href="about.php">about</a>
			<a href="package.php">package</a>
			<a href="book.php">book</a>
		</nav>

		<div id="menu-btn" class="fas fa-bars"></div>

	</section>

	<!--header section ends-->

	<div class="heading" style="background:url(images/about1.jpg) no-repeat;">
		<h1>about us</h1>
	</div>


	<!--about section-->

	<section class="about">

		<div class="image">
			<img src="images/img1.jpg">
		</div>

		<div class="content">
			<h3>why choose us?</h3>
			<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.</p>
			<p>Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.</p>

			<div class="icons-container">

				<div class="icons">
					<i class="fas fa-map"></i>
					<span>top destinations</span>
				</div>

				<div class="icons">
					<i class="fas fa-hand-holding-usd"></i>
					<span>afordable price</span>
				</div>

				<div class="icons">
					<i class="fas fa-headset"></i>
					<span>24/7 guide service</span>
				</div>
			</div>
		</div>

	</section>

	<!--about section-->

	<!--reviews section-->

	<section class="reviews">

		<div class="swiper reviews-slider">
			<div class="swiper-wrapper">

				<div class="swiper-slider slide">
					<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>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
					<h3>john doe</h3>
					<span>traveler</span>
					<img src="images/7.jpg">
				</div>

				<div class="swiper-slider slide">
					<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>
					</div>
					<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
					<h3>jane doe</h3>
					<span>traveler</span>
					<img src="images/8.jpg">
				</div>

				<div class="swiper-slider slide">
					<div class="stars">
						<i class="fas fa-star"></i>
						<i class="fas fa-star"></i>
						<i class="fas fa-star"></i>
					</div>
					<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
					<h3>peter doe</h3>
					<span>traveler</span>
					<img src="images/7.jpg">
				</div>

				<div class="swiper-slider slide">
					<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>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
					<h3>mary doe</h3>
					<span>traveler</span>
					<img src="images/8.jpg">
				</div>

				<div class="swiper-slider slide">
					<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>
					</div>
					<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
					<h3>alex doe</h3>
					<span>traveler</span>
					<img src="images/7.jpg">
				</div>

				
			</div>
		</div>

	</section>

	<!--reviews section ends-->

	<!-- footer section-->
	<section class="footer">

		<div class="box-container">

			<div class="box">
				<h3>quick links</h3>
				<a href="home.php"><i class="fas fa-angle-right"></i>home</a>
				<a href="about.php"><i class="fas fa-angle-right"></i>about</a>
				<a href="package.php"><i class="fas fa-angle-right"></i>package</a>
				<a href="book.php"><i class="fas fa-angle-right"></i>book</a>
			</div>

			<div class="box">
				<h3>extra links</h3>
				<a href="#"><i class="fas fa-angle-right"></i>ask questions</a>
				<a href="#"><i class="fas fa-angle-right"></i>about us</a>
				<a href="#"><i class="fas fa-angle-right"></i>privacy policy</a>
				<a href="#"><i class="fas fa-angle-right"></i>terms of use</a>
			</div>

			<div class="box">
				<h3>contact info</h3>
				<a href="#"><i class="fas fa-phone"></i>+254-705-667-551</a>
				<a href="#"><i class="fas fa-phone"></i>+254-723-250-983</a>
				<a href="#"><i class="fas fa-envelope"></i>zurukenya@gmail.com</a>
				<a href="#"><i class="fas fa-map"></i>Nairobi, Kenya</a>	
			</div>

			<div class="box">
				<h3>follow us</h3>
				<a href="href="#><i class="fab fa-facebook-f"></i>facebook</a>
				<a href="href="#><i class="fab fa-twitter"></i>twitter</a>
				<a href="href="#><i class="fab fa-instagram"></i>instagram</a>
				<a href="href="#><i class="fab fa-linkedin"></i>linkedin</a>
			</div>
		</div>

		<div class="credit"> created by <span>Esther Kiarie</span> | all rights reserved!</div>

	</section>
	<!-- footer section ends-->


	<!--swiper js link-->
	<script src="https://cdn.jsdelivr.net/npm/swiper@10/swiper-bundle.min.js"></script>

	<!--js file link-->
	<script src="js/script.js"></script>
</body>
</html>