<![CDATA[<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="bootstrap.css">
<link rel="stylesheet" href="mdb.css">
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
<div class="container">
<a class="navbar-brand" href="#">
<i class="fa fa-plane"></i> Travel Yari</a>
<ul class="navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item px-3">
<a class="nav-link" href="#">Search</a>
</li>
<li class="nav-item px-3">
<a class="nav-link" href="#">Visiting Spots</a>
</li>
<li class="nav-item px-3">
<a class="nav-link" href="#">Gallery</a>
</li>
<li class="nav-item px-3">
<a class="nav-link" href="#">Contact</a>
</li>
</div>
</nav>
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<img decoding="async" src="slider_one.jpg" class="d-block w-100" alt="...">
<div class="carousel-caption">
<div class="display-3 text-warning">Feel The Joy</div>
<p class="h4">Enjoy Every Moment of Your Travel</p>
<button class="btn btn-danger">Read More</button>
</div>
</div>
<div class="carousel-item">
<img decoding="async" src="slider_two.jpg" class="d-block w-100" alt="...">
<div class="carousel-caption">
<div class="display-3 text-warning">Enjoy the Tourisim</div>
<p class="h4">Enjoy Every Moment of your Travel</p>
<button class="btn btn-warning">Read More</button>
</div>
</div>
<div class="carousel-item">
<img decoding="async" src="slider_three.jpg" class="d-block w-100" alt="...">
</div>
</div>
</div>
<section class="bg-secondary text-white">
<div class="container p-3">
<div class="row">
<div class="col">
<h5 class="display-4">Search Your Destination</h5>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Error odio delectus sunt. Iste perspiciatis corrupti cumque laboriosam odit omnis aperiam voluptates minus, natus corporis dolore quia impedit mollitia aut nesciunt sapiente aspernatur recusandae officiis reiciendis tempore unde a quas repellendus!</p>
<div class="row">
<div class="col-md-6">
<div>
<input type="text" class="form-control" placeholder="Paris">
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="bg-light p-4">
<div class="container">
<div class="row">
<div class="col-md-4">
<div class="card text-center mt-3">
<div class="card-body">
<i class="fa fa-location-arrow fa-4x"></i>
<p class="h2">Pick Location</p>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Qui blanditiis earum illum nostrum odit atque officiis. Voluptatum perspiciatis voluptate asperiores quas, veniam iusto animi optio neque, facere quae quia autem. Blanditiis, beatae commodi corporis perspiciatis ullam similique deleniti amet alias?</p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card text-center mt-3">
<div class="card-body">
<i class="fa fa-building fa-4x"></i>
<p class="h2">Shop Travel</p>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Qui blanditiis earum illum nostrum odit atque officiis. Voluptatum perspiciatis voluptate asperiores quas, veniam iusto animi optio neque, facere quae quia autem. Blanditiis, beatae commodi corporis perspiciatis ullam similique deleniti amet alias?</p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card text-center mt-3">
<div class="card-body">
<i class="fa fa-plane fa-4x"></i>
<p class="h2">Fly Cheap</p>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Qui blanditiis earum illum nostrum odit atque officiis. Voluptatum perspiciatis voluptate asperiores quas, veniam iusto animi optio neque, facere quae quia autem. Blanditiis, beatae commodi corporis perspiciatis ullam similique deleniti amet alias?</p>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="p-3">
<div class="container">
<div class="row text-center">
<div class="col">
<h5 class="display-4">
<span class="text-primary">Popular</span> Places
</h5>
<p class="h5">Lorem ipsum dolor sit amet consectetur adipisicing elit. Incidunt, sit.</p>
</div>
</div>
<div class="row">
<div class="col-md-4">
<div class="card">
<img decoding="async" src="card_1.jpg" class="img-fluid">
<div class="card-body">
<h3 class="card-title">Munnar, Kerala</h3>
<p class="card-text">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Non inventore magnam ipsam, laboriosam maiores architecto! Sint consequatur iste ipsa assumenda!</p>
<button class="btn btn-primary btn-sm">Read More</button>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card">
<img decoding="async" src="card_2.jpg" class="img-fluid">
<div class="card-body">
<h3 class="card-title">Alappuza, Kerala</h3>
<p class="card-text">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Non inventore magnam ipsam, laboriosam maiores architecto! Sint consequatur iste ipsa assumenda!</p>
<button class="btn btn-primary btn-sm">Read More</button>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card">
<img decoding="async" src="card_3.jpg" class="img-fluid">
<div class="card-body">
<h3 class="card-title">Pondicherry</h3>
<p class="card-text">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Non inventore magnam ipsam, laboriosam maiores architecto! Sint consequatur iste ipsa assumenda!</p>
<button class="btn btn-primary btn-sm">Read More</button>
</div>
</div>
</div>
</div>
<div class="row mt-3">
<div class="col text-center">
<button class="btn btn-dark btn-lg">
<i class="fa fa-play mr-2"></i>Start Booking
</button>
</div>
</div>
</div>
</section>
<section class="bg-warning text-center">
<div class="container">
<div class="row">
<div class="col">
<h1>Follow Travel Yari</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fugiat, provident.</p>
<i class="fa fa-facebook-square fa-4x m-3"></i>
<i class="fa fa-youtube-square fa-4x m-3"></i>
<i class="fa fa-twitter-square fa-4x m-3"></i>
<i class="fa fa-google fa-4x m-3"></i>
</div>
</div>
</div>
</section>
<section>
<div class="container">
<div class="row text-center">
<div class="col">
<h5 class="display-4">
<span class="text-primary">Photo</span> Gallery
</h5>
<p class="h5">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Porro, vitae?</p>
</div>
</div>
<div class="row">
<div class="col-md-3">
<img decoding="async" src="gallery_1.jpg" class="img-fluid">
</div>
<div class="col-md-3">
<img decoding="async" src="gallery_2.jpg" class="img-fluid">
</div>
<div class="col-md-3">
<img decoding="async" src="gallery_3.jpg" class="img-fluid">
</div>
<div class="col-md-3">
<img decoding="async" src="gallery_4.jpg" class="img-fluid">
</div>
</div>
<div class="row mt-4">
<div class="col-md-3">
<img decoding="async" src="gallery_5.jpg" class="img-fluid">
</div>
<div class="col-md-3">
<img decoding="async" src="gallery_6.jpg" class="img-fluid">
</div>
<div class="col-md-3">
<img decoding="async" src="gallery_7.jpg" class="img-fluid">
</div>
<div class="col-md-3">
<img decoding="async" src="gallery_8.jpg" class="img-fluid">
</div>
</div>
<div class="row mt-4">
<div class="col-md-3">
<img decoding="async" src="gallery_9.jpg" class="img-fluid">
</div>
<div class="col-md-3">
<img decoding="async" src="gallery_10.jpg" class="img-fluid">
</div>
<div class="col-md-3">
<img decoding="async" src="gallery_11.jpg" class="img-fluid">
</div>
<div class="col-md-3">
<img decoding="async" src="gallery_12.jpg" class="img-fluid">
</div>
</div>
</div>
</section>
<script src="jquery.js"></script>
<script src="popper.js"></script>
<script src="bootstrap.js"></script>
<script src="mdb.js"></script>
<script>
$('.carousel').carousel({
interval: 5000
})
</script>
</body>
</html>]]>
