<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>ORV HeadQuarters - Tilte Post</title>
	<meta name="description" content="ATV & SxS performance shop that offers customization, upgrades along with your everyday maintenance! 42 Union Street, Smiths Falls, ON, Canada K7A 5C4.">

	<meta name="format-detection" content="telephone=no">
	
	<!-- 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=Bebas+Neue&display=swap" rel="stylesheet">
	<link rel="stylesheet" href="https://use.typekit.net/ymo0arc.css">
	<link rel="stylesheet" type="text/css" href="assets/font/proxima-nova.css">

	<!-- Bootstrap CSS -->
	<link rel="stylesheet" type="text/css" href="assets/bootstrap/css/bootstrap.min.css">


	<!-- ICONSAX ICONS -->
	<link rel="stylesheet" type="text/css" href="assets/iconsax/style.css">
    <!-- FONTAWESOME ICONS -->
	<link rel="stylesheet" type="text/css" href="assets/font-awesome/css/all.css">
	
	<!-- Bootstrap ICONS -->
	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.9.1/font/bootstrap-icons.css">

	<!-- Swiper CSS -->
	<link rel="stylesheet" href="assets/swiper/swiper-bundle.min.css">

	<!-- Tom Select CSS -->
	<link rel="stylesheet" href="assets/tom-select/tom-select.css">

    <!-- GLightBox -->
    <link rel="stylesheet" type="text/css" href="assets/glightbox/glightbox.min.css">

	<!-- Bootstrap Plus CSS -->
	<link rel="stylesheet" type="text/css" href="assets/css/bootstrap-plus.css">
	<!-- CSS -->
	<link rel="stylesheet" type="text/css" href="assets/css/style.css">

</head>
<body class="post-page bg-dark bg-noise text-white">
	<header class="position-relative">
        <a href="blog.php" class="mobile-navbar d-block d-lg-none bg-gradient-dark border-bottom border-1 border-white border-opacity-05 rounded-bottom text-primary text-md text-600 lh-sm text-center text-decoration-none p-4">
			<i class="bi bi-arrow-left me-2"></i>
			BACK TO BLOG
		</a>
		<?php include './src/navbar.php';?>
	</header>
	<main>
        <article class="mb-5 pb-5">
            
            <div class="row gx-0 justify-content-center">
                <div class="col-12 col-xl-11 mb-lg-5 pb-lg-4">
                    <div class="article-header position-relative overflow-hidden">
                        <img src="assets/images/Blog-images/post-2.png" alt="" class="article-header-img w-100 object-fit-cover rounded-3">
                        <div class="feature-img-overlay position-absolute w-100 h-100 top-0 d-block d-lg-none"></div>
                        <div class="article-header-text position-absolute w-100 h-100 top-0 rounded-3 d-flex flex-column justify-content-center px-4 px-md-5 px-lg-0 py-5 py-lg-0">
                            <h1 class="headline-2 text-800 lh-1 text-start text-lg-center text-uppercase mb-3 pb-lg-3 px-md-5 px-lg-4 pt-1 pt-lg-0">ORV TEAM DESERT ADVENTURE</h1>
                            <div class="row justify-content-start justify-content-lg-center">
                                <div class="col-12 col-md-10 col-lg-9 col-xl-8 col-xxl-6">
                                    <div class="article-header-data background-card-darker rounded-pill d-flex flex-wrap flex-lg-nowrap justify-content-between align-items-center px-md-5 p-lg-3">
                                        <p class="text-xs lh-1 text-600 pb-4 pb-md-0 d-inline mb-0">25 June 2022 9:21 AM</p>
                                        <p class="text-xs lh-1 text-600 me-3 ms-auto pb-4 pb-md-0 d-inline mb-0">
                                            <i class="icon-like-1 me-2"></i>
                                            121
                                        </p>
                                        <button class="btn btn-center btn-outline-white rounded-pill btn-2xs mt-3 mt-sm-5 mt-md-4 mt-lg-0">
                                            <i class="icon-export me-2 text-md"></i>
                                            <span class="d-inline-block">Share</span>
                                        </button> 
                                    </div>                                
                                </div>
                            </div>
                        </div>
                    </div>
                    
                </div>
            </div>
            <div class="container-lg g-0 g-lg-4 mt-neg-xxs">
                <div class="row gx-0 gx-lg-4 justify-content-center">
                    <div class="col-12 col-xl-10">
                        <div class="article-lead mb-5 mb-lg-4 pb-5 pb-lg-0 px-md-5 px-lg-0">
                            <p class="text-lg text-700 lh-1 mb-0 mb-md-5 mb-lg-0 px-4 px-md-5 px-lg-0 pb-md-4 pb-lg-0">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                        </div>
                    </div>
                </div>
            </div>
                
           
            <div class="container">
                <div class="row justify-content-center article-content mb-lg-5 pb-xl-3">
                    <div class="col-12 col-md-10 col-lg-12 col-xl-10 mb-5 pb-lg-2 pb-xxl-4">
                        <h3 class="article-subheader headline-3 lh-1 text-700 mb-3">Title 1</h3>
                        <p class="text-xs lh-1_1 mb-0">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                            
                    </div>
                    <div class="col-12 col-xl-10 slider mb-5 pb-lg-4 position-relative">                        
                        <div id="carouselArticleImg" class="carouselArticleImg carousel slide carousel-fade" data-bs-ride="carousel">
                            <div class="carousel-indicators d-flex d-lg-none mb-4 mb-md-5 pb-3 pb-md-1">
                              <button type="button" data-bs-target="#carouselArticleImg" data-bs-slide-to="0" class="active carousel-indicator rounded-circle border border-2 border-white opacity-100 bg-transparent mx-2" aria-current="true" aria-label="Slide 1"></button>
                              <button type="button" data-bs-target="#carouselArticleImg" data-bs-slide-to="1" class="carousel-indicator rounded-circle border border-2 border-white opacity-100 bg-transparent mx-2" aria-label="Slide 2"></button>
                              <button type="button" data-bs-target="#carouselArticleImg" data-bs-slide-to="2" class="carousel-indicator rounded-circle border border-2 border-white opacity-100 bg-transparent mx-2" aria-label="Slide 3"></button>
                            </div>
                            <div class="carousel-inner">
                              <div class="carousel-item active position-relative">                                
                                <a href="assets/images/Blog-images/post-2.png" class="glightbox">
                                    <img src="assets/images/Blog-images/post-2.png" class="d-block w-100 object-fit-cover" alt="quad" height="735">
                                    <span class="position-absolute top-0 end-0 text-white text-decoration-none text-xs lh-1 text-500 m-4 d-none d-lg-flex align-items-center">  
                                        <i class="icon-search-normal-1 text-md me-3"></i>
                                        See full photo
                                    </span>                                    
                                </a>
                            </div>
                            <div class="carousel-item position-relative">
                                <a href="assets/images/Blog-images/quad-1.jpg" class="glightbox">
                                    <img src="assets/images/Blog-images/quad-1.jpg" class="d-block w-100 object-fit-cover" alt="quad" height="735">
                                    <span class="position-absolute top-0 end-0 text-white text-decoration-none text-xs lh-1 text-500 m-4 d-none d-lg-flex align-items-center">  
                                        <i class="icon-search-normal-1 text-md me-3"></i>
                                        See full photo
                                    </span>                                    
                                </a>
                            </div>
                              <div class="carousel-item position-relative">
                                <a href="assets/images/Blog-images/quad-2.jpg" class="glightbox">
                                    <img src="assets/images/Blog-images/quad-2.jpg" class="d-block w-100 object-fit-cover" alt="quad" height="735">
                                    <span class="position-absolute top-0 end-0 text-white text-decoration-none text-xs lh-1 text-500 m-4 d-none d-lg-flex align-items-center">  
                                        <i class="icon-search-normal-1 text-md me-3"></i>
                                        See full photo
                                    </span>                                    
                                </a>
                            </div>
                            </div>
                            <button class="carousel-control-prev boxSize-xxl border border-2 border-white rounded-circle mb-3 mb-lg-4 mx-3 mx-lg-4 mt-auto opacity-100 bg-black bg-opacity-25" type="button" data-bs-target="#carouselArticleImg" data-bs-slide="prev">
                              <span class="carousel-control-prev-icon d-none" aria-hidden="true"></span>
                              <span class="visually-hidden">Previous</span>
                              <i class="icon-arrow-left text-lg"></i>
                            </button>
                            <button class="carousel-control-next boxSize-xxl border border-2 border-white rounded-circle mb-3 mb-lg-4 mx-3 mx-lg-4 mt-auto opacity-100 bg-black bg-opacity-25" type="button" data-bs-target="#carouselArticleImg" data-bs-slide="next">
                              <span class="carousel-control-next-icon d-none" aria-hidden="true"></span>
                              <span class="visually-hidden">Next</span>
                              <i class="icon-arrow-right-1 text-lg"></i>
                            </button>
                        </div>
                        <div class="carouselArticle-card position-absolute bg-white rounded-3 m-4 p-4 top-0 text-black d-none d-lg-block z-index_3">
                            <div class="position-absolute top-0 end-0 m-2 lh-1">
                                <button class="removeButton">
                                    <i class="fal fa-times text-xxs"></i> 
                                </button>
                            </div>                            
                            <p class="text-bebas text-md lh-1 pb-4">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                            <p class="text-xs lh-1_1 mb-0">Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip</p>
                        </div>
                    </div>
                    <div class="col-12 col-xl-10 mb-5 pb-md-3 pb-lg-4">
                        <div class="d-grid article-grid">
                            <div class="article-thumbnails-images mb-4 mb-lg-0 pb-3 pb-lg-0">
                                <div class="row justify-content-center">
                                    <div class="col-12 mb-lg-4 order-3 order-lg-1">
                                        <img src="assets/images/Blog-images/content-1.png" alt="quads" class="article-thumbnail-img object-fit-cover w-100 mb-lg-5" height="210">
                                    </div>
                                    <div class="col-6 col-lg-12 mb-4 order-2">
                                        <img src="assets/images/Blog-images/content-2.png" alt="quads" class="article-thumbnail-img object-fit-cover w-100 mb-lg-5" height="210">
                                    </div>
                                    <div class="col-6 col-lg-12 order-1 order-lg-3">
                                        <img src="assets/images/Blog-images/content-3.png" alt="quads" class="article-thumbnail-img object-fit-cover w-100" height="210">
                                    </div>
                                </div>
                            </div>
                            <div class="paragraf-1 mb-4">
                                <h3 class="article-subheader lh-1 text-700 mb-3">Title 2</h3>
                                <p class="text-xs lh-1_1 mb-0">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                                
                            </div>
                            <div class="article-hook mt-3 mt-lg-2 mb-4 mb-lg-3 pb-3">
                                <p class="text-bebas text-hook letter-spacing-6 py-4_5 mb-0 border-top border-bottom border-1 border-white">
                                    The Sahara is the largest hot desert on Earth.
                                </p>
                            </div>
                            <div class="paragraf-2 mb-4 pb-3 pb-lg-0">
                                <p class="text-xs lh-1_1 mb-0">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                                
                            </div>
                            <div class="paragraf-3">
                                <p class="text-xs lh-1_1 mb-0">Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                                
                            </div>
                        </div>
                    </div>      
                    <div class="col-12 col-md-10 col-lg-12 col-xl-10 share-buttons d-lg-flex justify-content-between">
                        <button class="btn btn-center btn-outline-white w-30 mb-4 mb-lg-0">
                            Like
                            <i class="icon-like-1 mx-2 text-md"></i>
                            121
                        </button>
                        <button class="btn btn-center btn-facebook w-30 mx-lg-auto mb-4 mb-lg-0">
                            <i class="fab fa-facebook text-md me-2"></i>
                            Share
                        </button>
                        <button class="btn btn-center btn-twitter w-30">
                            <i class="fab fa-twitter text-md me-2"></i>
                            Tweet
                        </button>
                    </div>
                </div>               
            </div>
        </article>
        <?php  include './src/section-browse.php'; ?>
    </main>	
    
	<?php 
        include './src/footer.php';
        include './src/navbar-offcanvas-chat.php';
        include './src/navbar-offcanvas-cart.php';
        include './src/navbar-offcanvas-user-panel.php';
        include './src/navbar-modal.php';
    ?>

	<!-- Bootstrap JS -->	
	<script type="text/javascript" src="assets/bootstrap/js/bootstrap.bundle.min.js" async></script>	

	<!-- Tom Select JS -->
	<script src="https://cdn.jsdelivr.net/npm/tom-select@2.1.0/dist/js/tom-select.complete.min.js"></script>

	<!-- Swiper JS -->
	<script src="assets/swiper/swiper-bundle.min.js" defer></script>

    <!-- GLightBox JS -->
    <script type="text/javascript" src="assets/glightbox/glightbox.min.js" defer></script>

	<!-- JS -->
	<script type="text/javascript" src="assets/js/calender.js" defer></script>
	<script type="text/javascript" src="assets/js/post-script.js" defer></script>
	<script type="text/javascript" src="assets/js/script.js" defer></script>
</body>
</html>