Access_New/demo-travel-agency-blog.html
2024-09-05 11:33:27 +05:45

488 lines
28 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 class="no-js" lang="en">
<head>
<title>Crafto - The Multipurpose HTML5 Template</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="author" content="ThemeZaa">
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<meta name="description" content="Elevate your online presence with Crafto - a modern, versatile, multipurpose Bootstrap 5 responsive HTML5, SCSS template using highly creative 52+ ready demos.">
<link rel="shortcut icon" href="images/favicon.png">
<link rel="apple-touch-icon" href="images/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
<link rel="preconnect" href="https://fonts.googleapis.com" crossorigin>
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="css/vendors.min.css" />
<link rel="stylesheet" href="css/icon.min.css" />
<link rel="stylesheet" href="css/style.min.css" />
<link rel="stylesheet" href="css/responsive.min.css" />
<link rel="stylesheet" href="demos/travel-agency/travel-agency.css" />
</head>
<body data-mobile-nav-style="classic">
<header class="header-with-topbar">
<div class="header-top-bar top-bar-light bg-white md-border-bottom border-color-transparent-dark-very-light disable-fixed">
<div class="container-fluid">
<div class="row h-45px align-items-center m-0">
<div class="col-xl-6 col-lg-8 justify-content-center justify-content-lg-start">
<div class="fs-15 text-dark-gray">We have a selection of over 50 tour programs! <a href="demo-travel-agency-destinations.html" class="text-base-color fw-500 text-decoration-line-bottom">Popular Destinations</a></div>
</div>
<div class="col-xl-6 col-lg-4 text-end d-none d-lg-flex">
<a href="tel:02228899900" class="widget fs-15 text-dark-gray text-dark-gray-hover"><i class="feather icon-feather-phone-call text-base-color"></i> 0222 8899900</a>
<div class="widget fs-15 ms-30px text-dark-gray d-none d-xl-inline-block"><i class="feather icon-feather-map-pin text-base-color"></i> Broadway, 24th Floor, San Francisco</div>
</div>
</div>
</div>
</div>
<nav class="navbar navbar-expand-lg header-transparent bg-transparent border-bottom border-color-transparent-white-light disable-fixed">
<div class="container-fluid">
<div class="col-auto col-lg-2 me-auto">
<a class="navbar-brand" href="demo-travel-agency.html">
<img src="images/demo-travel-agency-logo-white.png" data-at2x="images/demo-travel-agency-logo-white@2x.png" alt class="default-logo">
<img src="images/demo-travel-agency-logo-white.png" data-at2x="images/demo-travel-agency-logo-white@2x.png" alt class="alt-logo">
<img src="images/demo-travel-agency-logo-black.png" data-at2x="images/demo-travel-agency-logo-black@2x.png" alt class="mobile-logo">
</a>
</div>
<div class="col-auto col-lg-8 menu-order position-static">
<button class="navbar-toggler float-start" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-label="Toggle navigation">
<span class="navbar-toggler-line"></span>
<span class="navbar-toggler-line"></span>
<span class="navbar-toggler-line"></span>
<span class="navbar-toggler-line"></span>
</button>
<div class="collapse navbar-collapse justify-content-center" id="navbarNav">
<ul class="navbar-nav alt-font text-uppercase">
<li class="nav-item"><a href="demo-travel-agency.html" class="nav-link">Home</a></li>
<li class="nav-item"><a href="demo-travel-agency-about.html" class="nav-link">About</a></li>
<li class="nav-item dropdown dropdown-with-icon">
<a href="demo-travel-agency-destinations.html" class="nav-link">Destinations</a>
<i class="fa-solid fa-angle-down dropdown-toggle" id="navbarDropdownMenuLink" role="button" data-bs-toggle="dropdown" aria-expanded="false"></i>
<ul class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
<li>
<a href="demo-travel-agency-blog.html#">
<img src="images/demo-travel-agency-home-07.jpg" alt>
<div class="submenu-icon-content">
India
<p>42 Destinations</p>
</div>
</a>
</li>
<li>
<a href="demo-travel-agency-blog.html#">
<img src="images/demo-travel-agency-home-08.jpg" alt>
<div class="submenu-icon-content">
Poland
<p>36 Destinations</p>
</div>
</a>
</li>
<li>
<a href="demo-travel-agency-blog.html#">
<img src="images/demo-travel-agency-home-09.jpg" alt>
<div class="submenu-icon-content">
Mexico
<p>22 Destinations</p>
</div>
</a>
</li>
<li>
<a href="demo-travel-agency-blog.html#">
<img src="images/demo-travel-agency-home-13.jpg" alt>
<div class="submenu-icon-content">
Maldives
<p>28 Destinations</p>
</div>
</a>
</li>
<li>
<a href="demo-travel-agency-blog.html#" class="btn btn-dark-gray btn-round-edge btn-box-shadow align-self-center text-center text-white">tour packages</a>
</li>
</ul>
</li>
<li class="nav-item"><a href="demo-travel-agency-tours.html" class="nav-link">Tours</a></li>
<li class="nav-item"><a href="demo-travel-agency-reviews.html" class="nav-link">Reviews</a></li>
<li class="nav-item"><a href="demo-travel-agency-blog.html" class="nav-link">Blog</a></li>
<li class="nav-item"><a href="demo-travel-agency-contact.html" class="nav-link">Contact</a></li>
</ul>
</div>
</div>
<div class="col-auto col-lg-2 text-end">
<div class="header-icon">
<div class="header-search-icon icon">
<a href="demo-travel-agency-blog.html#" class="search-form-icon header-search-form"><i class="feather icon-feather-search"></i></a>
<div class="search-form-wrapper">
<button title="Close" type="button" class="search-close alt-font">×</button>
<form id="search-form" role="search" method="get" class="search-form text-left" action="search-result.html">
<div class="search-form-box">
<h2 class="text-dark-gray text-center mb-5 ls-minus-2px fw-600">What are you looking for?</h2>
<input class="search-input" id="search-form-input5e219ef164995" placeholder="Enter your keywords..." name="s" value type="text" autocomplete="off">
<button type="submit" class="search-button">
<i class="feather icon-feather-search" aria-hidden="true"></i>
</button>
</div>
</form>
</div>
</div>
<div class="header-push-button icon">
<div class="push-button">
<span></span>
<span></span>
<span></span>
<span></span>
</div>
</div>
</div>
</div>
</div>
</nav>
<div class="push-menu push-menu-style-1 p-35px bg-white">
<span class="close-menu text-white bg-dark-gray"><i class="fa-solid fa-xmark"></i></span>
<div class="text-center push-menu-wrapper text-dark-gray" data-scroll-options="{ &quot;theme&quot;: &quot;dark&quot; }">
<div class="w-100">
<img src="images/demo-travel-agency-logo-black.png" data-at2x="images/demo-travel-agency-logo-black@2x.png" class="mb-20" alt />
<div class="d-inline-block align-middle bg-very-light-gray fw-600 text-dark-gray text-uppercase border-radius-22px ps-25px pe-25px fs-13 mb-15px">Explore the world</div>
<h3 class="fw-600 mb-0 alt-font ls-minus-1px lh-38">World's leading travel agency</h3>
</div>
<div class="row align-items-center justify-content-center mt-20 mb-20 row-cols-3 row-cols-md-3 gutter-very-small row-cols-sm-3 instagram-follow-api position-relative">
<div class="col instafeed-grid mb-10px">
<figure class="border-radius-0px"><a href="https://www.instagram.com" target="_blank"><img src="images/demo-travel-agency-instagram-01.jpg" class="insta-image" alt><span class="insta-icon"><i class="fa-brands fa-instagram"></i></span></a></figure>
</div>
<div class="col instafeed-grid mb-10px">
<figure class="border-radius-0px"><a href="https://www.instagram.com" target="_blank"><img src="images/demo-travel-agency-instagram-02.jpg" class="insta-image" alt><span class="insta-icon"><i class="fa-brands fa-instagram"></i></span></a></figure>
</div>
<div class="col instafeed-grid mb-10px">
<figure class="border-radius-0px"><a href="https://www.instagram.com" target="_blank"><img src="images/demo-travel-agency-instagram-03.jpg" class="insta-image" alt><span class="insta-icon"><i class="fa-brands fa-instagram"></i></span></a></figure>
</div>
<div class="col instafeed-grid">
<figure class="border-radius-0px"><a href="https://www.instagram.com" target="_blank"><img src="images/demo-travel-agency-instagram-04.jpg" class="insta-image" alt><span class="insta-icon"><i class="fa-brands fa-instagram"></i></span></a></figure>
</div>
<div class="col instafeed-grid">
<figure class="border-radius-0px"><a href="https://www.instagram.com" target="_blank"><img src="images/demo-travel-agency-instagram-05.jpg" class="insta-image" alt><span class="insta-icon"><i class="fa-brands fa-instagram"></i></span></a></figure>
</div>
<div class="col instafeed-grid">
<figure class="border-radius-0px"><a href="https://www.instagram.com" target="_blank"><img src="images/demo-travel-agency-instagram-06.jpg" class="insta-image" alt><span class="insta-icon"><i class="fa-brands fa-instagram"></i></span></a></figure>
</div>
</div>
<div class="col-12 text-center newsletter-style-02 position-relative mb-20">
<span class="fs-18 w-80 mx-auto text-extra-dark-gray lh-26 d-inline-block mb-25px">Get latest update for our trusted applications</span>
<form action="email-templates/subscribe-newsletter.php" method="post" class="position-relative w-100">
<input class="border-radius-5px bg-white w-100 form-control required" type="email" name="email" placeholder="Enter your email">
<input type="hidden" name="redirect" value>
<button class="btn submit" aria-label="submit"><i class="icon feather icon-feather-mail icon-small"></i></button>
<div class="form-results border-radius-4px pt-10px pb-10px ps-15px pe-15px fs-14 w-100 text-center position-absolute lh-24 d-none"></div>
</form>
</div>
<div class="col-12 text-center elements-social social-icon-style-01">
<ul class="small-icon dark mb-0">
<li><a class="facebook" href="https://www.facebook.com/" target="_blank"><i class="fa-brands fa-facebook-f"></i></a></li>
<li><a class="dribbble" href="http://www.dribbble.com" target="_blank"><i class="fa-brands fa-dribbble"></i></a></li>
<li><a class="twitter" href="https://www.twitter.com" target="_blank"><i class="fa-brands fa-twitter"></i></a></li>
<li><a class="instagram" href="https://www.instagram.com" target="_blank"><i class="fa-brands fa-instagram"></i></a></li>
<li><a class="linkedin" href="http://www.linkedin.com" target="_blank"><i class="fa-brands fa-linkedin-in"></i></a></li>
</ul>
</div>
</div>
</div>
</header>
<section class="page-title-button-style cover-background position-relative ipad-top-space-margin top-space-padding md-pt-20px" style="background-image: url('images/demo-travel-agency-blog-title-bg.jpg')">
<div class="opacity-light bg-bay-of-many-blue"></div>
<div class="container">
<div class="row align-items-center justify-content-center extra-small-screen">
<div class="col-lg-6 col-md-8 position-relative text-center page-title-extra-large" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;translateY&quot;: [30, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<h2 class="text-uppercase mb-10px alt-font text-white fw-500 bg-dark-gray border-radius-4px">Amazing stories</h2>
<h1 class="mb-0 text-white alt-font ls-minus-2px text-uppercase fw-600 text-shadow-double-large">Travel Blog</h1>
</div>
</div>
</div>
</section>
<section class="bg-very-light-gray position-relative">
<div class="h-110px position-absolute w-100 h-100 left-0px right-0px top-minus-70px" style="background-image:url('images/demo-travel-agency-home-bg-02.png')"></div>
<div class="container">
<div class="row">
<div class="mb-2 md-mb-7 sm-mb-0">
<ul class="blog-modern blog-wrapper grid-loading grid grid-3col xl-grid-3col lg-grid-3col md-grid-2col sm-grid-2col xs-grid-1col gutter-extra-large" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;translateY&quot;: [50, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 1200, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 150, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<li class="grid-sizer"></li>
<li class="grid-item mb-40px sm-mb-20px">
<div class="box-hover text-center">
<figure class="mb-0 position-relative">
<div class="blog-image position-relative overflow-hidden border-radius-6px">
<a href="demo-travel-agency-blog-single-modern.html"><img src="images/demo-travel-agency-blog-01.jpg" alt /></a>
</div>
<figcaption class="post-content-wrapper overflow-hidden border-radius-6px">
<div class="position-relative bg-dark-gray post-content p-30px z-index-2 lh-initial">
<a href="demo-travel-agency-blog-single-modern.html" class="card-title mb-0 fs-20 lh-28 text-white d-inline-block">It takes a real designer to design for real women</a>
<div class="box-overlay bg-dark-gray z-index-minus-1"></div>
</div>
<div class="fs-15 bg-white p-15px lg-ps-10px lg-pe-10px lh-initial"><span class="d-inline-block">By <a href="demo-travel-agency-blog.html">Jonse robbert</a></span><span class="separator d-inline-block">|</span><a href="demo-travel-agency-blog.html#">30 Nov 2023</a></div>
</figcaption>
</figure>
</div>
</li>
<li class="grid-item mb-40px sm-mb-20px">
<div class="box-hover text-center">
<figure class="mb-0 position-relative">
<div class="blog-image position-relative overflow-hidden border-radius-6px">
<a href="demo-travel-agency-blog-single-modern.html"><img src="images/demo-travel-agency-blog-02.jpg" alt /></a>
</div>
<figcaption class="post-content-wrapper overflow-hidden border-radius-6px">
<div class="position-relative bg-dark-gray post-content p-30px z-index-2 lh-initial">
<a href="demo-travel-agency-blog-single-modern.html" class="card-title mb-0 fs-20 lh-28 text-white d-inline-block">Experience breathtaking views and perspectives</a>
<div class="box-overlay bg-dark-gray z-index-minus-1"></div>
</div>
<div class="fs-15 bg-white p-15px lg-ps-10px lg-pe-10px lh-initial"><span class="d-inline-block">By <a href="demo-travel-agency-blog.html">Andy glamere</a></span><span class="separator d-inline-block">|</span><a href="demo-travel-agency-blog.html#">28 Nov 2023</a></div>
</figcaption>
</figure>
</div>
</li>
<li class="grid-item mb-40px sm-mb-20px">
<div class="box-hover text-center">
<figure class="mb-0 position-relative">
<div class="blog-image position-relative overflow-hidden border-radius-6px">
<a href="demo-travel-agency-blog-single-modern.html"><img src="images/demo-travel-agency-blog-03.jpg" alt /></a>
</div>
<figcaption class="post-content-wrapper overflow-hidden border-radius-6px">
<div class="position-relative bg-dark-gray post-content p-30px z-index-2 lh-initial">
<a href="demo-travel-agency-blog-single-modern.html" class="card-title mb-0 fs-20 lh-28 text-white d-inline-block">Teamwork is essential for small teams to challenges</a>
<div class="box-overlay bg-dark-gray z-index-minus-1"></div>
</div>
<div class="fs-15 bg-white p-15px lg-ps-10px lg-pe-10px lh-initial"><span class="d-inline-block">By <a href="demo-travel-agency-blog.html">Rosald smith</a></span><span class="separator d-inline-block">|</span><a href="demo-travel-agency-blog.html#">26 Nov 2023</a></div>
</figcaption>
</figure>
</div>
</li>
<li class="grid-item mb-40px sm-mb-20px">
<div class="box-hover text-center">
<figure class="mb-0 position-relative">
<div class="blog-image position-relative overflow-hidden border-radius-6px">
<a href="demo-travel-agency-blog-single-modern.html"><img src="images/demo-travel-agency-blog-04.jpg" alt /></a>
</div>
<figcaption class="post-content-wrapper overflow-hidden border-radius-6px">
<div class="position-relative bg-dark-gray post-content p-30px z-index-2 lh-initial">
<a href="demo-travel-agency-blog-single-modern.html" class="card-title mb-0 fs-20 lh-28 text-white d-inline-block">Build up healthy habits and strong peaceful life</a>
<div class="box-overlay bg-dark-gray z-index-minus-1"></div>
</div>
<div class="fs-15 bg-white p-15px lg-ps-10px lg-pe-10px lh-initial"><span class="d-inline-block">By <a href="demo-travel-agency-blog.html">Jonse robbert</a></span><span class="separator d-inline-block">|</span><a href="demo-travel-agency-blog.html#">22 Nov 2023</a></div>
</figcaption>
</figure>
</div>
</li>
<li class="grid-item mb-40px sm-mb-20px">
<div class="box-hover text-center">
<figure class="mb-0 position-relative">
<div class="blog-image position-relative overflow-hidden border-radius-6px">
<a href="demo-travel-agency-blog-single-modern.html"><img src="images/demo-travel-agency-blog-05.jpg" alt /></a>
</div>
<figcaption class="post-content-wrapper overflow-hidden border-radius-6px">
<div class="position-relative bg-dark-gray post-content p-30px z-index-2 lh-initial">
<a href="demo-travel-agency-blog-single-modern.html" class="card-title mb-0 fs-20 lh-28 text-white d-inline-block">Some people just try to celebrate the joys of life</a>
<div class="box-overlay bg-dark-gray z-index-minus-1"></div>
</div>
<div class="fs-15 bg-white p-15px lg-ps-10px lg-pe-10px lh-initial"><span class="d-inline-block">By <a href="demo-travel-agency-blog.html">Rosald smith</a></span><span class="separator d-inline-block">|</span><a href="demo-travel-agency-blog.html#">20 Nov 2023</a></div>
</figcaption>
</figure>
</div>
</li>
<li class="grid-item mb-40px sm-mb-20px">
<div class="box-hover text-center">
<figure class="mb-0 position-relative">
<div class="blog-image position-relative overflow-hidden border-radius-6px">
<a href="demo-travel-agency-blog-single-modern.html"><img src="images/demo-travel-agency-blog-06.jpg" alt /></a>
</div>
<figcaption class="post-content-wrapper overflow-hidden border-radius-6px">
<div class="position-relative bg-dark-gray post-content p-30px z-index-2 lh-initial">
<a href="demo-travel-agency-blog-single-modern.html" class="card-title mb-0 fs-20 lh-28 text-white d-inline-block">Many focus on embracing what they can control</a>
<div class="box-overlay bg-dark-gray z-index-minus-1"></div>
</div>
<div class="fs-15 bg-white p-15px lg-ps-10px lg-pe-10px lh-initial"><span class="d-inline-block">By <a href="demo-travel-agency-blog.html">Den viliamson</a></span><span class="separator d-inline-block">|</span><a href="demo-travel-agency-blog.html#">18 Nov 2023</a></div>
</figcaption>
</figure>
</div>
</li>
<li class="grid-item mb-40px sm-mb-20px">
<div class="box-hover text-center">
<figure class="mb-0 position-relative">
<div class="blog-image position-relative overflow-hidden border-radius-6px">
<a href="demo-travel-agency-blog-single-modern.html"><img src="images/demo-travel-agency-blog-07.jpg" alt /></a>
</div>
<figcaption class="post-content-wrapper overflow-hidden border-radius-6px">
<div class="position-relative bg-dark-gray post-content p-30px z-index-2 lh-initial">
<a href="demo-travel-agency-blog-single-modern.html" class="card-title mb-0 fs-20 lh-28 text-white d-inline-block">No matter what you're feeling or experiencing</a>
<div class="box-overlay bg-dark-gray z-index-minus-1"></div>
</div>
<div class="fs-15 bg-white p-15px lg-ps-10px lg-pe-10px lh-initial"><span class="d-inline-block">By <a href="demo-travel-agency-blog.html">Den viliamson</a></span><span class="separator d-inline-block">|</span><a href="demo-travel-agency-blog.html#">14 Nov 2023</a></div>
</figcaption>
</figure>
</div>
</li>
<li class="grid-item mb-40px sm-mb-20px">
<div class="box-hover text-center">
<figure class="mb-0 position-relative">
<div class="blog-image position-relative overflow-hidden border-radius-6px">
<a href="demo-travel-agency-blog-single-modern.html"><img src="images/demo-travel-agency-blog-08.jpg" alt /></a>
</div>
<figcaption class="post-content-wrapper overflow-hidden border-radius-6px">
<div class="position-relative bg-dark-gray post-content p-30px z-index-2 lh-initial">
<a href="demo-travel-agency-blog-single-modern.html" class="card-title mb-0 fs-20 lh-28 text-white d-inline-block">The pessimist sees difficulty in opportunity</a>
<div class="box-overlay bg-dark-gray z-index-minus-1"></div>
</div>
<div class="fs-15 bg-white p-15px lg-ps-10px lg-pe-10px lh-initial"><span class="d-inline-block">By <a href="demo-travel-agency-blog.html">Jonse robbert</a></span><span class="separator d-inline-block">|</span><a href="demo-travel-agency-blog.html#">12 Nov 2023</a></div>
</figcaption>
</figure>
</div>
</li>
<li class="grid-item mb-40px">
<div class="box-hover text-center">
<figure class="mb-0 position-relative">
<div class="blog-image position-relative overflow-hidden border-radius-6px">
<a href="demo-travel-agency-blog-single-modern.html"><img src="images/demo-travel-agency-blog-09.jpg" alt /></a>
</div>
<figcaption class="post-content-wrapper overflow-hidden border-radius-6px">
<div class="position-relative bg-dark-gray post-content p-30px z-index-2 lh-initial">
<a href="demo-travel-agency-blog-single-modern.html" class="card-title mb-0 fs-20 lh-28 text-white d-inline-block">Experience breathtaking views and perspectives</a>
<div class="box-overlay bg-dark-gray z-index-minus-1"></div>
</div>
<div class="fs-15 bg-white p-15px lg-ps-10px lg-pe-10px lh-initial"><span class="d-inline-block">By <a href="demo-travel-agency-blog.html">Andy glamere</a></span><span class="separator d-inline-block">|</span><a href="demo-travel-agency-blog.html#">10 Nov 2023</a></div>
</figcaption>
</figure>
</div>
</li>
</ul>
<div class="row">
<div class="col-12 mt-1 mb-3 d-flex justify-content-center">
<ul class="pagination pagination-style-01 fs-13 mb-0" data-anime="{ &quot;translate&quot;: [0, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;: 100, &quot;staggervalue&quot;: 150, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<li class="page-item"><a class="page-link" href="demo-travel-agency-blog.html#"><i class="feather icon-feather-arrow-left fs-18 d-xs-none"></i></a></li>
<li class="page-item"><a class="page-link" href="demo-travel-agency-blog.html#">01</a></li>
<li class="page-item active"><a class="page-link" href="demo-travel-agency-blog.html#">02</a></li>
<li class="page-item"><a class="page-link" href="demo-travel-agency-blog.html#">03</a></li>
<li class="page-item"><a class="page-link" href="demo-travel-agency-blog.html#">04</a></li>
<li class="page-item"><a class="page-link" href="demo-travel-agency-blog.html#"><i class="feather icon-feather-arrow-right fs-18 d-xs-none"></i></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</section>
<footer class="bg-light-gray pb-40px">
<div class="container">
<div class="row mb-2 md-mb-4 overlap-section" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;translateY&quot;: [-15, 0], &quot;scale&quot;: [0.5, 1], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 800, &quot;delay&quot;: 300, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<div class="col-12 text-center">
<img class="rounded-circle" src="images/demo-travel-agency-home-16.png" alt />
</div>
</div>
<div class="row justify-content-center mb-6 md-mb-8 xs-mb-40px">
<div class="col-xl-6 col-lg-8 col-md-10 text-center last-paragraph-no-margin">
<h2 class="text-dark-gray alt-font fw-600 mb-40px mx-auto w-90 ls-minus-2px">Get the amazing travel offers into your inbox!</h2>
<div class="d-inline-block w-100 newsletter-style-03 position-relative mb-30px">
<form action="email-templates/subscribe-newsletter.php" method="post" class="position-relative w-100">
<input class="input-large bg-white border-color-transparent w-100 border-radius-100px box-shadow-extra-large form-control required" type="email" name="email" placeholder="Enter your email address" />
<input type="hidden" name="redirect" value>
<button class="btn btn-large text-dark-gray ls-0px left-icon submit fw-600" aria-label="submit"><i class="icon feather icon-feather-mail icon-small text-base-color"></i><span>Subscribe</span></button>
<div class="form-results border-radius-100px pt-10px pb-10px ps-15px pe-15px fs-16 mt-10px w-100 z-index-1 text-center position-absolute d-none"></div>
</form>
</div>
<p class="fs-16 lh-normal">We are committed to protecting your <a href="demo-travel-agency-blog.html#" class="text-decoration-line-bottom text-dark-gray text-dark-gray-hover">privacy policy.</a></p>
</div>
</div>
<div class="row align-items-center justify-content-center mb-40px g-0 row-cols-3 row-cols-md-6 row-cols-sm-3 instagram-follow-api position-relative">
<div class="col instafeed-grid">
<figure class="border-radius-0px"><a href="https://www.instagram.com" target="_blank"><img src="images/demo-travel-agency-instagram-01.jpg" class="insta-image" alt><span class="insta-icon"><i class="fa-brands fa-instagram"></i></span></a></figure>
</div>
<div class="col instafeed-grid">
<figure class="border-radius-0px"><a href="https://www.instagram.com" target="_blank"><img src="images/demo-travel-agency-instagram-02.jpg" class="insta-image" alt><span class="insta-icon"><i class="fa-brands fa-instagram"></i></span></a></figure>
</div>
<div class="col instafeed-grid">
<figure class="border-radius-0px"><a href="https://www.instagram.com" target="_blank"><img src="images/demo-travel-agency-instagram-03.jpg" class="insta-image" alt><span class="insta-icon"><i class="fa-brands fa-instagram"></i></span></a></figure>
</div>
<div class="col instafeed-grid">
<figure class="border-radius-0px"><a href="https://www.instagram.com" target="_blank"><img src="images/demo-travel-agency-instagram-04.jpg" class="insta-image" alt><span class="insta-icon"><i class="fa-brands fa-instagram"></i></span></a></figure>
</div>
<div class="col instafeed-grid">
<figure class="border-radius-0px"><a href="https://www.instagram.com" target="_blank"><img src="images/demo-travel-agency-instagram-05.jpg" class="insta-image" alt><span class="insta-icon"><i class="fa-brands fa-instagram"></i></span></a></figure>
</div>
<div class="col instafeed-grid">
<figure class="border-radius-0px"><a href="https://www.instagram.com" target="_blank"><img src="images/demo-travel-agency-instagram-06.jpg" class="insta-image" alt><span class="insta-icon"><i class="fa-brands fa-instagram"></i></span></a></figure>
</div>
<div class="absolute-middle-center z-index-1 w-auto">
<a href="https://www.instagram.com" target="_blank" class="btn btn-medium btn-switch-text btn-white btn-round-edge fw-600 ls-0px left-icon btn-box-shadow instagram-button">
<span>
<span><i class="fa-brands fa-instagram text-base-color fs-20"></i></span>
<span class="btn-double-text" data-text="crafto instagram">crafto instagram</span>
</span>
</a>
</div>
</div>
<div class="row align-items-center">
<div class="col-xl-3 col-sm-6 text-center text-sm-start last-paragraph-no-margin fs-15 text-dark-gray order-3 order-md-1">
<p>&COPY; Copyright 2024 <a href="index.html" target="_blank" class="text-dark-gray text-dark-gray-hover text-decoration-line-bottom fw-600">Crafto</a></p>
</div>
<div class="col-xl-6 text-center lg-mt-10px sm-mt-0 sm-mb-15px order-1 order-xl-2 order-md-3">
<ul class="footer-navbar">
<li class="nav-item"><a href="demo-travel-agency-about.html" class="nav-link">About</a></li>
<li class="nav-item"><a href="demo-travel-agency-destinations.html" class="nav-link">Destinations</a></li>
<li class="nav-item"><a href="demo-travel-agency-tours.html" class="nav-link">Tours</a></li>
<li class="nav-item"><a href="demo-travel-agency-reviews.html" class="nav-link">Reviews</a></li>
<li class="nav-item"><a href="demo-travel-agency-blog.html" class="nav-link">Blog</a></li>
<li class="nav-item"><a href="demo-travel-agency-contact.html" class="nav-link">Contact</a></li>
</ul>
</div>
<div class="col-xl-3 col-sm-6 position-relative text-center text-sm-end elements-social social-text-style-08 order-2 order-xl-3 xs-mb-10px">
<ul class="small-icon dark">
<li><a class="facebook" href="https://www.facebook.com/" target="_blank"><i class="fa-brands fa-facebook-f"></i></a></li>
<li><a class="dribbble" href="http://www.dribbble.com" target="_blank"><i class="fa-brands fa-dribbble"></i></a></li>
<li><a class="twitter" href="https://www.twitter.com" target="_blank"><i class="fa-brands fa-twitter"></i></a></li>
<li><a class="instagram" href="https://www.instagram.com" target="_blank"><i class="fa-brands fa-instagram"></i></a></li>
</ul>
</div>
</div>
</div>
</footer>
<div class="scroll-progress d-none d-xxl-block">
<a href="demo-travel-agency-blog.html#" class="scroll-top" aria-label="scroll">
<span class="scroll-text">Scroll</span><span class="scroll-line"><span class="scroll-point"></span></span>
</a>
</div>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/vendors.min.js"></script>
<script type="text/javascript" src="js/main.js"></script>
</body>
</html>