You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

508 lines
22 KiB

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title>Nova Bootstrap Template - Blog</title>
<meta content="" name="description">
<meta content="" name="keywords">
<!-- Favicons -->
<link href="assets/img/favicon.png" rel="icon">
<link href="assets/img/apple-touch-icon.png" rel="apple-touch-icon">
<!-- Google Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,600;1,700&family=Montserrat:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&family=Raleway:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap" rel="stylesheet">
<!-- Vendor CSS Files -->
<link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
<link href="assets/vendor/aos/aos.css" rel="stylesheet">
<link href="assets/vendor/glightbox/css/glightbox.min.css" rel="stylesheet">
<link href="assets/vendor/swiper/swiper-bundle.min.css" rel="stylesheet">
<link href="assets/vendor/remixicon/remixicon.css" rel="stylesheet">
<!-- Template Main CSS File -->
<link href="assets/css/main.css" rel="stylesheet">
<!-- =======================================================
* Template Name: Nova - v1.1.0
* Template URL: https://bootstrapmade.com/nova-bootstrap-business-template/
* Author: BootstrapMade.com
* License: https://bootstrapmade.com/license/
======================================================== -->
</head>
<body class="page-blog">
<!-- ======= Header ======= -->
<header id="header" class="header d-flex align-items-center fixed-top">
<div class="container-fluid container-xl d-flex align-items-center justify-content-between">
<a href="index.html" class="logo d-flex align-items-center">
<!-- Uncomment the line below if you also wish to use an image logo -->
<!-- <img src="assets/img/logo.png" alt=""> -->
<h1 class="d-flex align-items-center">Nova</h1>
</a>
<i class="mobile-nav-toggle mobile-nav-show bi bi-list"></i>
<i class="mobile-nav-toggle mobile-nav-hide d-none bi bi-x"></i>
<nav id="navbar" class="navbar">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="team.html">Team</a></li>
<li><a href="blog.html" class="active">Blog</a></li>
<li class="dropdown"><a href="#"><span>Dropdown</span> <i class="bi bi-chevron-down dropdown-indicator"></i></a>
<ul>
<li><a href="#">Dropdown 1</a></li>
<li class="dropdown"><a href="#"><span>Deep Dropdown</span> <i class="bi bi-chevron-down dropdown-indicator"></i></a>
<ul>
<li><a href="#">Deep Dropdown 1</a></li>
<li><a href="#">Deep Dropdown 2</a></li>
<li><a href="#">Deep Dropdown 3</a></li>
<li><a href="#">Deep Dropdown 4</a></li>
<li><a href="#">Deep Dropdown 5</a></li>
</ul>
</li>
<li><a href="#">Dropdown 2</a></li>
<li><a href="#">Dropdown 3</a></li>
<li><a href="#">Dropdown 4</a></li>
</ul>
</li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav><!-- .navbar -->
</div>
</header><!-- End Header -->
<main id="main">
<!-- ======= Breadcrumbs ======= -->
<div class="breadcrumbs d-flex align-items-center" style="background-image: url('assets/img/blog-header.jpg');">
<div class="container position-relative d-flex flex-column align-items-center">
<h2>Blog</h2>
<ol>
<li><a href="index.html">Home</a></li>
<li>Blog</li>
</ol>
</div>
</div><!-- End Breadcrumbs -->
<!-- ======= Blog Section ======= -->
<section id="blog" class="blog">
<div class="container" data-aos="fade-up">
<div class="row g-5">
<div class="col-lg-8" data-aos="fade-up" data-aos-delay="200">
<div class="row gy-5 posts-list">
<div class="col-lg-6">
<article class="d-flex flex-column">
<div class="post-img">
<img src="assets/img/blog/blog-1.jpg" alt="" class="img-fluid">
</div>
<h2 class="title">
<a href="blog-details.html">Dolorum optio tempore voluptas dignissimos cumque fuga qui quibusdam quia</a>
</h2>
<div class="meta-top">
<ul>
<li class="d-flex align-items-center"><i class="bi bi-person"></i> <a href="blog-details.html">John Doe</a></li>
<li class="d-flex align-items-center"><i class="bi bi-clock"></i> <a href="blog-details.html"><time datetime="2022-01-01">Jan 1, 2022</time></a></li>
<li class="d-flex align-items-center"><i class="bi bi-chat-dots"></i> <a href="blog-details.html">12 Comments</a></li>
</ul>
</div>
<div class="content">
<p>
Similique neque nam consequuntur ad non maxime aliquam quas. Quibusdam animi praesentium. Aliquam et laboriosam eius aut nostrum quidem aliquid dicta.
</p>
</div>
<div class="read-more mt-auto align-self-end">
<a href="blog-details.html">Read More <i class="bi bi-arrow-right"></i></a>
</div>
</article>
</div><!-- End post list item -->
<div class="col-lg-6">
<article class="d-flex flex-column">
<div class="post-img">
<img src="assets/img/blog/blog-2.jpg" alt="" class="img-fluid">
</div>
<h2 class="title">
<a href="blog-details.html">Nisi magni odit consequatur autem nulla dolorem</a>
</h2>
<div class="meta-top">
<ul>
<li class="d-flex align-items-center"><i class="bi bi-person"></i> <a href="blog-details.html">John Doe</a></li>
<li class="d-flex align-items-center"><i class="bi bi-clock"></i> <a href="blog-details.html"><time datetime="2022-01-01">Jan 1, 2022</time></a></li>
<li class="d-flex align-items-center"><i class="bi bi-chat-dots"></i> <a href="blog-details.html">12 Comments</a></li>
</ul>
</div>
<div class="content">
<p>
Incidunt voluptate sit temporibus aperiam. Quia vitae aut sint ullam quis illum voluptatum et. Quo libero rerum voluptatem pariatur nam.
</p>
</div>
<div class="read-more mt-auto align-self-end">
<a href="blog-details.html">Read More <i class="bi bi-arrow-right"></i></a>
</div>
</article>
</div><!-- End post list item -->
<div class="col-lg-6">
<article class="d-flex flex-column">
<div class="post-img">
<img src="assets/img/blog/blog-3.jpg" alt="" class="img-fluid">
</div>
<h2 class="title">
<a href="blog-details.html">Possimus soluta ut id suscipit ea ut. In quo quia et soluta libero sit sint.</a>
</h2>
<div class="meta-top">
<ul>
<li class="d-flex align-items-center"><i class="bi bi-person"></i> <a href="blog-details.html">John Doe</a></li>
<li class="d-flex align-items-center"><i class="bi bi-clock"></i> <a href="blog-details.html"><time datetime="2022-01-01">Jan 1, 2022</time></a></li>
<li class="d-flex align-items-center"><i class="bi bi-chat-dots"></i> <a href="blog-details.html">12 Comments</a></li>
</ul>
</div>
<div class="content">
<p>
Aut iste neque ut illum qui perspiciatis similique recusandae non. Fugit autem dolorem labore omnis et. Eum temporibus fugiat voluptate enim tenetur sunt omnis.
</p>
</div>
<div class="read-more mt-auto align-self-end">
<a href="blog-details.html">Read More <i class="bi bi-arrow-right"></i></a>
</div>
</article>
</div><!-- End post list item -->
<div class="col-lg-6">
<article class="d-flex flex-column">
<div class="post-img">
<img src="assets/img/blog/blog-4.jpg" alt="" class="img-fluid">
</div>
<h2 class="title">
<a href="blog-details.html">Non rem rerum nam cum quo minus. Dolor distinctio deleniti explicabo eius exercitationem.</a>
</h2>
<div class="meta-top">
<ul>
<li class="d-flex align-items-center"><i class="bi bi-person"></i> <a href="blog-details.html">John Doe</a></li>
<li class="d-flex align-items-center"><i class="bi bi-clock"></i> <a href="blog-details.html"><time datetime="2022-01-01">Jan 1, 2022</time></a></li>
<li class="d-flex align-items-center"><i class="bi bi-chat-dots"></i> <a href="blog-details.html">12 Comments</a></li>
</ul>
</div>
<div class="content">
<p>
Aspernatur rerum perferendis et sint. Voluptates cupiditate voluptas atque quae. Rem veritatis rerum enim et autem. Saepe atque cum eligendi eaque iste omnis a qui.
</p>
</div>
<div class="read-more mt-auto align-self-end">
<a href="blog-details.html">Read More <i class="bi bi-arrow-right"></i></a>
</div>
</article>
</div><!-- End post list item -->
<div class="col-lg-6">
<article class="d-flex flex-column">
<div class="post-img">
<img src="assets/img/blog/blog-5.jpg" alt="" class="img-fluid">
</div>
<h2 class="title">
<a href="blog-details.html">Accusamus quaerat aliquam qui debitis facilis consequatur</a>
</h2>
<div class="meta-top">
<ul>
<li class="d-flex align-items-center"><i class="bi bi-person"></i> <a href="blog-details.html">John Doe</a></li>
<li class="d-flex align-items-center"><i class="bi bi-clock"></i> <a href="blog-details.html"><time datetime="2022-01-01">Jan 1, 2022</time></a></li>
<li class="d-flex align-items-center"><i class="bi bi-chat-dots"></i> <a href="blog-details.html">12 Comments</a></li>
</ul>
</div>
<div class="content">
<p>
In itaque assumenda aliquam voluptatem qui temporibus iusto nisi quia. Autem vitae quas aperiam nesciunt mollitia tempora odio omnis. Ipsa odit sit ut amet necessitatibus. Quo ullam ut corrupti autem consequuntur totam dolorem.
</p>
</div>
<div class="read-more mt-auto align-self-end">
<a href="blog-details.html">Read More <i class="bi bi-arrow-right"></i></a>
</div>
</article>
</div><!-- End post list item -->
<div class="col-lg-6">
<article class="d-flex flex-column">
<div class="post-img">
<img src="assets/img/blog/blog-6.jpg" alt="" class="img-fluid">
</div>
<h2 class="title">
<a href="blog-details.html">Distinctio provident quibusdam numquam aperiam aut</a>
</h2>
<div class="meta-top">
<ul>
<li class="d-flex align-items-center"><i class="bi bi-person"></i> <a href="blog-details.html">John Doe</a></li>
<li class="d-flex align-items-center"><i class="bi bi-clock"></i> <a href="blog-details.html"><time datetime="2022-01-01">Jan 1, 2022</time></a></li>
<li class="d-flex align-items-center"><i class="bi bi-chat-dots"></i> <a href="blog-details.html">12 Comments</a></li>
</ul>
</div>
<div class="content">
<p>
Expedita et temporibus eligendi enim molestiae est architecto praesentium dolores. Illo laboriosam officiis quis. Labore officia quia sit voluptatem nisi est dignissimos totam. Et voluptate et consectetur voluptatem id dolor magni impedit. Omnis dolores sit.
</p>
</div>
<div class="read-more mt-auto align-self-end">
<a href="blog-details.html">Read More <i class="bi bi-arrow-right"></i></a>
</div>
</article>
</div><!-- End post list item -->
</div><!-- End blog posts list -->
<div class="blog-pagination">
<ul class="justify-content-center">
<li><a href="#">1</a></li>
<li class="active"><a href="#">2</a></li>
<li><a href="#">3</a></li>
</ul>
</div><!-- End blog pagination -->
</div>
<div class="col-lg-4" data-aos="fade-up" data-aos-delay="400">
<div class="sidebar ps-lg-4">
<div class="sidebar-item search-form">
<h3 class="sidebar-title">Search</h3>
<form action="" class="mt-3">
<input type="text">
<button type="submit"><i class="bi bi-search"></i></button>
</form>
</div><!-- End sidebar search formn-->
<div class="sidebar-item categories">
<h3 class="sidebar-title">Categories</h3>
<ul class="mt-3">
<li><a href="#">General <span>(25)</span></a></li>
<li><a href="#">Lifestyle <span>(12)</span></a></li>
<li><a href="#">Travel <span>(5)</span></a></li>
<li><a href="#">Design <span>(22)</span></a></li>
<li><a href="#">Creative <span>(8)</span></a></li>
<li><a href="#">Educaion <span>(14)</span></a></li>
</ul>
</div><!-- End sidebar categories-->
<div class="sidebar-item recent-posts">
<h3 class="sidebar-title">Recent Posts</h3>
<div class="mt-3">
<div class="post-item mt-3">
<img src="assets/img/blog/blog-recent-1.jpg" alt="" class="flex-shrink-0">
<div>
<h4><a href="blog-post.html">Nihil blanditiis at in nihil autem</a></h4>
<time datetime="2020-01-01">Jan 1, 2020</time>
</div>
</div><!-- End recent post item-->
<div class="post-item">
<img src="assets/img/blog/blog-recent-2.jpg" alt="" class="flex-shrink-0">
<div>
<h4><a href="blog-post.html">Quidem autem et impedit</a></h4>
<time datetime="2020-01-01">Jan 1, 2020</time>
</div>
</div><!-- End recent post item-->
<div class="post-item">
<img src="assets/img/blog/blog-recent-3.jpg" alt="" class="flex-shrink-0">
<div>
<h4><a href="blog-post.html">Id quia et et ut maxime similique occaecati ut</a></h4>
<time datetime="2020-01-01">Jan 1, 2020</time>
</div>
</div><!-- End recent post item-->
<div class="post-item">
<img src="assets/img/blog/blog-recent-4.jpg" alt="" class="flex-shrink-0">
<div>
<h4><a href="blog-post.html">Laborum corporis quo dara net para</a></h4>
<time datetime="2020-01-01">Jan 1, 2020</time>
</div>
</div><!-- End recent post item-->
<div class="post-item">
<img src="assets/img/blog/blog-recent-5.jpg" alt="" class="flex-shrink-0">
<div>
<h4><a href="blog-post.html">Et dolores corrupti quae illo quod dolor</a></h4>
<time datetime="2020-01-01">Jan 1, 2020</time>
</div>
</div><!-- End recent post item-->
</div>
</div><!-- End sidebar recent posts-->
<div class="sidebar-item tags">
<h3 class="sidebar-title">Tags</h3>
<ul class="mt-3">
<li><a href="#">App</a></li>
<li><a href="#">IT</a></li>
<li><a href="#">Business</a></li>
<li><a href="#">Mac</a></li>
<li><a href="#">Design</a></li>
<li><a href="#">Office</a></li>
<li><a href="#">Creative</a></li>
<li><a href="#">Studio</a></li>
<li><a href="#">Smart</a></li>
<li><a href="#">Tips</a></li>
<li><a href="#">Marketing</a></li>
</ul>
</div><!-- End sidebar tags-->
</div><!-- End Blog Sidebar -->
</div>
</div>
</div>
</section><!-- End Blog Section -->
</main><!-- End #main -->
<!-- ======= Footer ======= -->
<footer id="footer" class="footer">
<div class="footer-content">
<div class="container">
<div class="row gy-4">
<div class="col-lg-5 col-md-12 footer-info">
<a href="index.html" class="logo d-flex align-items-center">
<span>Nova</span>
</a>
<p>Cras fermentum odio eu feugiat lide par naso tierra. Justo eget nada terra videa magna derita valies darta donna mare fermentum iaculis eu non diam phasellus.</p>
<div class="social-links d-flex mt-3">
<a href="#" class="twitter"><i class="bi bi-twitter"></i></a>
<a href="#" class="facebook"><i class="bi bi-facebook"></i></a>
<a href="#" class="instagram"><i class="bi bi-instagram"></i></a>
<a href="#" class="linkedin"><i class="bi bi-linkedin"></i></a>
</div>
</div>
<div class="col-lg-2 col-6 footer-links">
<h4>Useful Links</h4>
<ul>
<li><i class="bi bi-dash"></i> <a href="#">Home</a></li>
<li><i class="bi bi-dash"></i> <a href="#">About us</a></li>
<li><i class="bi bi-dash"></i> <a href="#">Services</a></li>
<li><i class="bi bi-dash"></i> <a href="#">Terms of service</a></li>
<li><i class="bi bi-dash"></i> <a href="#">Privacy policy</a></li>
</ul>
</div>
<div class="col-lg-2 col-6 footer-links">
<h4>Our Services</h4>
<ul>
<li><i class="bi bi-dash"></i> <a href="#">Web Design</a></li>
<li><i class="bi bi-dash"></i> <a href="#">Web Development</a></li>
<li><i class="bi bi-dash"></i> <a href="#">Product Management</a></li>
<li><i class="bi bi-dash"></i> <a href="#">Marketing</a></li>
<li><i class="bi bi-dash"></i> <a href="#">Graphic Design</a></li>
</ul>
</div>
<div class="col-lg-3 col-md-12 footer-contact text-center text-md-start">
<h4>Contact Us</h4>
<p>
A108 Adam Street <br>
New York, NY 535022<br>
United States <br><br>
<strong>Phone:</strong> +1 5589 55488 55<br>
<strong>Email:</strong> info@example.com<br>
</p>
</div>
</div>
</div>
</div>
<div class="footer-legal">
<div class="container">
<div class="copyright">
&copy; Copyright <strong><span>Nova</span></strong>. All Rights Reserved
</div>
<div class="credits">
<!-- All the links in the footer should remain intact. -->
<!-- You can delete the links only if you purchased the pro version. -->
<!-- Licensing information: https://bootstrapmade.com/license/ -->
<!-- Purchase the pro version with working PHP/AJAX contact form: https://bootstrapmade.com/nova-bootstrap-business-template/ -->
Designed by <a href="https://bootstrapmade.com/">BootstrapMade</a>
</div>
</div>
</div>
</footer><!-- End Footer -->
<!-- End Footer -->
<a href="#" class="scroll-top d-flex align-items-center justify-content-center"><i class="bi bi-arrow-up-short"></i></a>
<div id="preloader"></div>
<!-- Vendor JS Files -->
<script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="assets/vendor/aos/aos.js"></script>
<script src="assets/vendor/glightbox/js/glightbox.min.js"></script>
<script src="assets/vendor/swiper/swiper-bundle.min.js"></script>
<script src="assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
<script src="assets/vendor/php-email-form/validate.js"></script>
<!-- Template Main JS File -->
<script src="assets/js/main.js"></script>
</body>
</html>