truncgit/citrus-cms
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
main
citrus-cms/template/index-3.html
T
Ümit Tunç 37e7296527 ikinci temizlik tamamlandı
2026-04-28 21:15:09 +03:00

2193 lines
95 KiB
HTML
Raw Permalink Blame History

<!DOCTYPE html>
<html lang="en">
<head>
<title>Blogzine - Blog and Magazine Bootstrap 5 Theme</title>
<!-- Meta Tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="author" content="Webestica.com">
<meta name="description" content="Bootstrap based News, Magazine and Blog Theme">
<!-- Favicon -->
<link rel="shortcut icon" href="assets/images/favicon.ico">
<!-- Google Font -->
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;700&family=Rubik:wght@400;500;700&display=swap" rel="stylesheet">
<!-- Plugins CSS -->
<link rel="stylesheet" type="text/css" href="assets/vendor/font-awesome/css/all.min.css">
<link rel="stylesheet" type="text/css" href="assets/vendor/bootstrap-icons/bootstrap-icons.css">
<link rel="stylesheet" type="text/css" href="assets/vendor/tiny-slider/tiny-slider.css">
<link rel="stylesheet" type="text/css" href="assets/vendor/glightbox/css/glightbox.css">
<link rel="stylesheet" type="text/css" href="assets/vendor/plyr/plyr.css">
<!-- Theme CSS -->
<link id="style-switch" rel="stylesheet" type="text/css" href="assets/css/style.css">
</head>
<body>
<!-- Offcanvas START -->
<div class="offcanvas offcanvas-end" tabindex="-1" id="offcanvasMenu">
<div class="offcanvas-header justify-content-end">
<button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close"></button>
</div>
<div class="offcanvas-body d-flex flex-column pt-0">
<div>
<img class="light-mode-item my-3" src="assets/images/logo.svg" alt="logo">
<img class="dark-mode-item my-3" src="assets/images/logo-light.svg" alt="logo">
<p>The next-generation blog, news, and magazine theme for you to start sharing your stories today! </p>
<!-- Nav START -->
<ul class="nav d-block flex-column my-4">
<li class="nav-item h5">
<a class="nav-link" href="index.html">Home</a>
<li class="nav-item h5">
<a class="nav-link" href="#">About</a>
</li>
<li class="nav-item h5">
<a class="nav-link" href="#">Our Journal</a>
</li>
<li class="nav-item h5">
<a class="nav-link" href="#">Contact Us</a>
</li>
</ul>
<!-- Nav END -->
<div class="bg-primary bg-opacity-10 p-4 mb-4 text-center w-100 rounded">
<span>The Blogzine</span>
<h3>Save on Premium Membership</h3>
<p>Get the insights report trusted by experts around the globe. Become a Member Today!</p>
<a href="#" class="btn btn-warning">View pricing plans</a>
</div>
</div>
<div class="mt-auto pb-3">
<!-- Address -->
<p class="text-body mb-2 fw-bold">New York, USA (HQ)</p>
<address class="mb-0">750 Sing Sing Rd, Horseheads, NY, 14845</address>
<p class="mb-2">Call: <a href="#" class="text-body"><u>469-537-2410</u> (Toll-free)</a> </p>
<a href="#" class="text-body d-block">hello@blogzine.com</a>
</div>
</div>
</div>
<!-- Offcanvas END -->
<!-- =======================
Header START -->
<header>
<!-- Navbar top -->
<div class="navbar-top d-none d-lg-block">
<div class="container">
<div class="row d-flex align-items-center my-2">
<!-- Top bar left -->
<div class="col-sm-8 d-sm-flex align-items-center">
<!-- Title -->
<div class="me-3">
<span class="badge bg-primary p-2 px-3 text-white">Trending:</span>
</div>
<!-- Slider -->
<div class="tiny-slider arrow-end arrow-xs arrow-bordered arrow-round arrow-md-none">
<div class="tiny-slider-inner"
data-autoplay="true"
data-hoverpause="true"
data-gutter="0"
data-arrow="true"
data-dots="false"
data-items="1">
<!-- Slider items -->
<div> <a href="#" class="text-reset btn-link">The most common business debate isn't as black and white as you might think</a></div>
<div> <a href="#" class="text-reset btn-link">How the 10 worst business fails of all time could have been prevented </a></div>
<div> <a href="#" class="text-reset btn-link">The most common business debate isn't as black and white as you might think </a></div>
</div>
</div>
</div>
<!-- Top bar right -->
<div class="col-sm-4">
<ul class="list-inline mb-0 text-center text-sm-end">
<li class="list-inline-item">
<span>Wed, March 31, 2022</span>
</li>
<li class="list-inline-item">
<i class="bi bi-cloud-hail text-info"></i>
<span>13 °C NY, USA</span>
</li>
</ul>
</div>
</div>
<!-- Divider -->
<div class="border-bottom border-2 border-primary opacity-1"></div>
</div>
</div>
<!-- Navbar logo section START -->
<div>
<div class="container">
<div class="d-sm-flex justify-content-sm-between align-items-sm-center my-2">
<!-- Logo START -->
<a class="navbar-brand d-block" href="index.html">
<img class="navbar-brand-item light-mode-item" src="assets/images/logo.svg" alt="logo" style="height: 46px;">
<img class="navbar-brand-item dark-mode-item" src="assets/images/logo-light.svg" alt="logo" style="height: 46px;">
</a>
<!-- Logo END -->
<!-- Adv -->
<div>
<a href="#" class="card-img-flash d-block">
<img src="assets/images/adv-2.png" alt="adv">
</a>
</div>
</div>
</div>
</div>
<!-- Navbar logo section END -->
<!-- Navbar START -->
<div class="navbar-sticky header-static">
<nav class="navbar navbar-dark navbar-expand-lg">
<div class="container">
<div class="w-100 bg-dark d-flex">
<!-- Responsive navbar toggler -->
<button class="navbar-toggler me-auto" type="button" data-bs-toggle="collapse" data-bs-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
<span class="text-muted h6 ps-3">Menu</span>
<span class="navbar-toggler-icon"></span>
</button>
<!-- Main navbar START -->
<div class="collapse navbar-collapse" id="navbarCollapse">
<ul class="navbar-nav navbar-nav-scroll navbar-lh-sm">
<!-- Nav item 1 Demos -->
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle active" href="#" id="homeMenu" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Home</a>
<ul class="dropdown-menu" aria-labelledby="homeMenu">
<li> <a class="dropdown-item" href="index.html">Home default</a></li>
<li> <a class="dropdown-item" href="index-lazy.html">Home lazy load</a></li>
<li> <a class="dropdown-item" href="index-2.html">Magazine classic</a></li>
<li> <a class="dropdown-item active" href="index-3.html">Magazine</a></li>
<li> <a class="dropdown-item" href="index-4.html">Home cards</a></li>
<li> <a class="dropdown-item" href="index-5.html">Blog classic</a></li>
<li> <a class="dropdown-item" href="index-6.html">Blog Personal </a></li>
<li> <a class="dropdown-item" href="index-7.html">Blog Vintage</a></li>
<li> <a class="dropdown-item" href="index-8.html">Blog Tech</a></li>
<li> <a class="dropdown-item" href="index-9.html">Blog Fashion</a></li>
<li> <a class="dropdown-item" href="index-10.html">Blog Podcast</a></li>
<li> <a class="dropdown-item" href="index-11.html">Home Shop <span class="badge bg-danger smaller me-1">New</span></a></li>
</ul>
</li>
<!-- Nav item 2 Pages -->
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="pagesMenu" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Pages</a>
<ul class="dropdown-menu" aria-labelledby="pagesMenu">
<li> <a class="dropdown-item" href="about-us.html">About</a></li>
<li> <a class="dropdown-item" href="contact-us.html">Contact</a></li>
<!-- Dropdown submenu -->
<li class="dropdown-submenu dropend">
<a class="dropdown-item dropdown-toggle" href="#">Shop <span class="badge bg-danger smaller me-1">New</span></a>
<ul class="dropdown-menu dropdown-menu-start" data-bs-popper="none">
<li> <a class="dropdown-item" href="shop-grid.html">Shop grid <span class="badge bg-danger smaller me-1">New</span></a> </li>
<li> <a class="dropdown-item" href="shop-detail.html">Shop detail <span class="badge bg-danger smaller me-1">New</span></a> </li>
<li> <a class="dropdown-item" href="checkout.html">Checkout <span class="badge bg-danger smaller me-1">New</span></a> </li>
<li> <a class="dropdown-item" href="my-cart.html">Cart <span class="badge bg-danger smaller me-1">New</span></a> </li>
<li> <a class="dropdown-item" href="empty-cart.html">Empty cart <span class="badge bg-danger smaller me-1">New</span></a> </li>
</ul>
</li>
<!-- Dropdown submenu -->
<li class="dropdown-submenu dropend">
<a class="dropdown-item dropdown-toggle" href="#">Other Archives</a>
<ul class="dropdown-menu dropdown-menu-start" data-bs-popper="none">
<li> <a class="dropdown-item" href="author.html">Author Page</a> </li>
<li> <a class="dropdown-item" href="categories.html">Category page 1</a> </li>
<li> <a class="dropdown-item" href="categories-2.html">Category page 2</a> </li>
<li> <a class="dropdown-item" href="tag.html"># tag</a> </li>
<li> <a class="dropdown-item" href="search-result.html">Search result</a> </li>
</ul>
</li>
<li> <a class="dropdown-item" href="404.html">Error 404</a></li>
<li> <a class="dropdown-item" href="signin.html">signin</a></li>
<li> <a class="dropdown-item" href="signup.html">signup</a></li>
<li> <a class="dropdown-item" href="offline.html">offline</a></li>
<!-- Dropdown submenu levels -->
<li class="dropdown-divider"></li>
<li class="dropdown-submenu dropend">
<a class="dropdown-item dropdown-toggle" href="#">Dropdown levels</a>
<ul class="dropdown-menu dropdown-menu-start" data-bs-popper="none">
<!-- dropdown submenu open right -->
<li class="dropdown-submenu dropend">
<a class="dropdown-item dropdown-toggle" href="#">Dropdown (end)</a>
<ul class="dropdown-menu" data-bs-popper="none">
<li> <a class="dropdown-item" href="#">Dropdown item</a> </li>
<li> <a class="dropdown-item" href="#">Dropdown item</a> </li>
</ul>
</li>
<li> <a class="dropdown-item" href="#">Dropdown item</a> </li>
<!-- dropdown submenu open left -->
<li class="dropdown-submenu dropstart">
<a class="dropdown-item dropdown-toggle" href="#">Dropdown (start)</a>
<ul class="dropdown-menu dropdown-menu-end" data-bs-popper="none">
<li> <a class="dropdown-item" href="#">Dropdown item</a> </li>
<li> <a class="dropdown-item" href="#">Dropdown item</a> </li>
</ul>
</li>
<li> <a class="dropdown-item" href="#">Dropdown item</a> </li>
</ul>
</li>
<li class="dropdown-divider"></li>
<li>
<a class="dropdown-item" href="https://support.webestica.com/" target="_blank">
<i class="text-warning fa-fw bi bi-life-preserver me-2"></i>Support
</a>
</li>
<li>
<a class="dropdown-item" href="docs/index.html" target="_blank">
<i class="text-danger fa-fw bi bi-card-text me-2"></i>Documentation
</a>
</li>
<li class="dropdown-divider"></li>
<li>
<a class="dropdown-item" href="https://blogzine.webestica.com/rtl" target="_blank">
<i class="text-info fa-fw bi bi-toggle-off me-2"></i>RTL demo
</a>
</li>
<li>
<a class="dropdown-item" href="https://themes.getbootstrap.com/store/webestica/" target="_blank">
<i class="text-success fa-fw bi bi-cloud-download-fill me-2"></i>Buy blogzine!
</a>
</li>
</ul>
</li>
<!-- Nav item 3 Post -->
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="postMenu" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Post</a>
<ul class="dropdown-menu" aria-labelledby="postMenu">
<!-- dropdown submenu -->
<li class="dropdown-submenu dropend">
<a class="dropdown-item dropdown-toggle" href="#">Post grid</a>
<ul class="dropdown-menu dropdown-menu-start" data-bs-popper="none">
<li> <a class="dropdown-item" href="post-grid.html">Post grid</a> </li>
<li> <a class="dropdown-item" href="post-grid-4-col.html">Post grid 4 col</a> </li>
<li> <a class="dropdown-item" href="post-grid-masonry.html">Post grid masonry</a> </li>
<li> <a class="dropdown-item" href="post-grid-masonry-filter.html">Post grid masonry filter</a> </li>
<li> <a class="dropdown-item" href="post-large-and-grid.html">Post mixed large than grid</a> </li>
</ul>
</li>
<li> <a class="dropdown-item" href="post-list.html">Post list</a> </li>
<li> <a class="dropdown-item" href="post-list-2.html">Post list 2</a> </li>
<li> <a class="dropdown-item" href="post-cards.html">Post card</a> </li>
<li> <a class="dropdown-item" href="post-overlay.html">Post Overlay</a> </li>
<li> <a class="dropdown-item" href="post-types.html">Post types</a> </li>
<li class="dropdown-divider"></li>
<li> <a class="dropdown-item" href="post-single.html">Post single magazine</a> </li>
<li> <a class="dropdown-item" href="post-single-2.html">Post single classic</a> </li>
<li> <a class="dropdown-item" href="post-single-3.html">Post single minimal</a> </li>
<li> <a class="dropdown-item" href="post-single-4.html">Post single card</a> </li>
<li> <a class="dropdown-item" href="post-single-5.html">Post single review</a> </li>
<li> <a class="dropdown-item" href="post-single-6.html">Post single video</a> </li>
<li> <a class="dropdown-item" href="podcast-single.html">Podcast single</a> </li>
<li class="dropdown-divider"></li>
<li> <a class="dropdown-item" href="create-post.html">Create post <span class="badge text-bg-danger smaller me-1">New</span></a> </li>
<li> <a class="dropdown-item" href="pagination-styles.html">Pagination styles</a> </li>
</ul>
</li>
<!-- Nav item 4 Mega menu -->
<li class="nav-item dropdown dropdown-fullwidth">
<a class="nav-link dropdown-toggle" href="#" id="megaMenu" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> Lifestyle</a>
<div class="dropdown-menu" aria-labelledby="megaMenu">
<div class="container">
<div class="row g-4 p-3 flex-fill">
<!-- Card item START -->
<div class="col-sm-6 col-lg-3">
<div class="card bg-transparent">
<!-- Card img -->
<img class="card-img rounded" src="assets/images/blog/16by9/small/01.jpg" alt="Card image">
<div class="card-body px-0 pt-3">
<h6 class="card-title mb-0"><a href="#" class="btn-link text-reset fw-bold">7 common mistakes everyone makes while traveling</a></h6>
<!-- Card info -->
<ul class="nav nav-divider align-items-center text-uppercase small mt-2">
<li class="nav-item">
<a href="#" class="text-reset btn-link">Joan Wallace</a>
</li>
<li class="nav-item">Feb 18, 2022</li>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="col-sm-6 col-lg-3">
<div class="card bg-transparent">
<!-- Card img -->
<img class="card-img rounded" src="assets/images/blog/16by9/small/02.jpg" alt="Card image">
<div class="card-body px-0 pt-3">
<h6 class="card-title mb-0"><a href="#" class="btn-link text-reset fw-bold">12 worst types of business accounts you follow on Twitter</a></h6>
<!-- Card info -->
<ul class="nav nav-divider align-items-center text-uppercase small mt-2">
<li class="nav-item">
<a href="#" class="text-reset btn-link">Lori Stevens</a>
</li>
<li class="nav-item">Jun 03, 2022</li>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="col-sm-6 col-lg-3">
<div class="card bg-transparent">
<!-- Card img -->
<img class="card-img rounded" src="assets/images/blog/16by9/small/03.jpg" alt="Card image">
<div class="card-body px-0 pt-3">
<h6 class="card-title mb-0"><a href="#" class="btn-link text-reset fw-bold">Skills that you can learn from business</a></h6>
<!-- Card info -->
<ul class="nav nav-divider align-items-center text-uppercase small mt-2">
<li class="nav-item">
<a href="#" class="text-reset btn-link">Judy Nguyen</a>
</li>
<li class="nav-item">Sep 07, 2022</li>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="col-sm-6 col-lg-3">
<div class="bg-primary bg-opacity-10 p-4 text-center h-100 w-100 rounded">
<span>The Blogzine</span>
<h3>Premium Membership</h3>
<p>Become a Member Today!</p>
<a href="#" class="btn btn-warning">View pricing plans</a>
</div>
</div>
<!-- Card item END -->
</div> <!-- Row END -->
<!-- Trending tags -->
<div class="row px-3">
<div class="col-12">
<ul class="list-inline mt-3">
<li class="list-inline-item">Trending tags:</li>
<li class="list-inline-item"><a href="#" class="btn btn-sm btn-primary-soft">Travel</a></li>
<li class="list-inline-item"><a href="#" class="btn btn-sm btn-warning-soft">Business</a></li>
<li class="list-inline-item"><a href="#" class="btn btn-sm btn-success-soft">Tech</a></li>
<li class="list-inline-item"><a href="#" class="btn btn-sm btn-danger-soft">Gadgets</a></li>
<li class="list-inline-item"><a href="#" class="btn btn-sm btn-info-soft">Lifestyle</a></li>
<li class="list-inline-item"><a href="#" class="btn btn-sm btn-primary-soft">Vaccine</a></li>
<li class="list-inline-item"><a href="#" class="btn btn-sm btn-success-soft">Sports</a></li>
<li class="list-inline-item"><a href="#" class="btn btn-sm btn-danger-soft">Covid-19</a></li>
<li class="list-inline-item"><a href="#" class="btn btn-sm btn-info-soft">Politics</a></li>
</ul>
</div>
</div> <!-- Row END -->
</div>
</div>
</li>
<!-- Nav item 5 link-->
<li class="nav-item"> <a class="nav-link" href="dashboard.html">Dashboard</a></li>
</ul>
</div>
<!-- Main navbar END -->
<!-- Nav right START -->
<div class="nav flex-nowrap align-items-center me-2">
<!-- Dark mode switch -->
<div class="nav-item">
<div class="modeswitch" id="darkModeSwitch">
<div class="switch"></div>
</div>
</div>
<!-- Nav bookmark -->
<div class="nav-item">
<a class="nav-link" href="#">
<i class="bi bi-bookmark-heart fs-4"></i>
</a>
</div>
<!-- Nav user -->
<div class="nav-item">
<a class="nav-link" href="#">
<i class="bi bi-person-square fs-4"></i>
</a>
</div>
<!-- Nav Search -->
<div class="nav-item dropdown nav-search dropdown-toggle-icon-none">
<a class="nav-link text-uppercase dropdown-toggle" role="button" href="#" id="navSearch" data-bs-toggle="dropdown" aria-expanded="false">
<i class="bi bi-search fs-4"> </i>
</a>
<div class="dropdown-menu dropdown-menu-end shadow rounded p-2" aria-labelledby="navSearch">
<form class="input-group">
<input class="form-control border-success" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-success m-0" type="submit">Search</button>
</form>
</div>
</div>
<!-- Offcanvas menu toggler -->
<div class="nav-item">
<a class="nav-link pe-0" data-bs-toggle="offcanvas" href="#offcanvasMenu" role="button" aria-controls="offcanvasMenu">
<i class="bi bi-text-right rtl-flip fs-2" data-bs-target="#offcanvasMenu"> </i>
</a>
</div>
</div>
<!-- Nav right END -->
</div>
</div>
</nav>
</div>
<!-- Navbar END -->
</header>
<!-- =======================
Header END -->
<!-- **************** MAIN CONTENT START **************** -->
<main>
<!-- =======================
Latest news slider START -->
<section class="py-4 card-grid">
<div class="container">
<div class="row">
<div class="col">
<!-- Slider START -->
<div class="tiny-slider">
<div class="tiny-slider-inner"
data-autoplay="true"
data-hoverpause="true"
data-gutter="24"
data-arrow="false"
data-dots="false"
data-items-md="2"
data-items-sm="2"
data-items-xs="1"
data-items="3" >
<!-- Card item START -->
<div class="card">
<div class="row g-3">
<div class="col-3">
<img class="rounded-3" src="assets/images/blog/1by1/01.jpg" alt="">
</div>
<div class="col-9">
<h5><a href="post-single-5.html" class="btn-link stretched-link text-reset fw-bold">The pros and cons of business agency</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center small">
<li class="nav-item">
<div class="nav-link position-relative">
<span>by <a href="#" class="stretched-link text-reset btn-link">Samuel</a></span>
</div>
</li>
<li class="nav-item">Jan 22, 2022</li>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card">
<div class="row g-3">
<div class="col-3">
<img class="rounded-3" src="assets/images/blog/1by1/02.jpg" alt="">
</div>
<div class="col-9">
<h5><a href="post-single-5.html" class="btn-link stretched-link text-reset fw-bold">5 reasons why you shouldn't startup</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center small">
<li class="nav-item">
<div class="nav-link position-relative">
<span>by <a href="#" class="stretched-link text-reset btn-link">Dennis</a></span>
</div>
</li>
<li class="nav-item">Mar 07, 2022</li>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card">
<div class="row g-3">
<div class="col-3">
<img class="rounded-3" src="assets/images/blog/1by1/03.jpg" alt="">
</div>
<div class="col-9">
<h5><a href="post-single-5.html" class="btn-link stretched-link text-reset fw-bold">Five unbelievable facts about money.</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center small">
<li class="nav-item">
<div class="nav-link position-relative">
<span>by <a href="#" class="stretched-link text-reset btn-link">Bryan</a></span>
</div>
</li>
<li class="nav-item">Jun 17, 2022</li>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card">
<div class="row g-3">
<div class="col-3">
<img class="rounded-3" src="assets/images/blog/1by1/04.jpg" alt="">
</div>
<div class="col-9">
<h5><a href="post-single-5.html" class="btn-link stretched-link text-reset fw-bold">The web: 20 infographics about business</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center small">
<li class="nav-item">
<div class="nav-link position-relative">
<span>by <a href="#" class="stretched-link text-reset btn-link">Jacqueline</a></span>
</div>
</li>
<li class="nav-item">Nov 11, 2022</li>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
</div>
</div>
</div>
</div> <!-- Row END -->
</div>
</section>
<!-- =======================
Latest news slider END -->
<!-- =======================
Main hero START -->
<section class="py-0 card-grid">
<div class="container">
<div class="row">
<!-- Slider START -->
<div class="col-lg-7">
<div class="tiny-slider arrow-hover arrow-blur arrow-round rounded-3">
<div class="tiny-slider-inner"
data-autoplay="false"
data-hoverpause="true"
data-gutter="0"
data-arrow="true"
data-dots="false"
data-items="1">
<!-- Slide 1 -->
<div class="card card-overlay-bottom card-bg-scale h-400 h-lg-560 rounded-0" style="background-image:url(assets/images/blog/16by9/07.jpg); background-position: center left; background-size: cover;">
<!-- Card Image overlay -->
<div class="card-img-overlay d-flex flex-column p-3 p-sm-5">
<!-- Card overlay Top -->
<div class="w-100 mb-auto d-flex justify-content-end">
<div class="text-end ms-auto">
<!-- Card format icon -->
<div class="icon-md bg-primary bg-opacity-10 bg-blur text-white rounded-circle" title="This post has video"><i class="fas fa-video"></i></div>
</div>
</div>
<!-- Card overlay Bottom -->
<div class="w-100 mt-auto">
<div class="col">
<!-- Card category -->
<a href="#" class="badge text-bg-primary mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Business</a>
<!-- Card title -->
<h2 class="text-white display-5"><a href="post-single-4.html" class="btn-link text-reset stretched-link fw-normal">Never underestimate the influence of social media</a></h2>
<p class="text-white">For who thoroughly her boy estimating conviction. Removed demands expense account in outward tedious do.</p>
<!-- Card info -->
<ul class="nav nav-divider text-white-force align-items-center d-none d-sm-inline-block">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center text-white position-relative">
<div class="avatar avatar-sm">
<img class="avatar-img rounded-circle" src="assets/images/avatar/01.jpg" alt="avatar">
</div>
<span class="ms-3">by <a href="#" class="stretched-link text-reset btn-link">Carolyn</a></span>
</div>
</div>
</li>
<li class="nav-item">Jan 26, 2022</li>
<li class="nav-item">3 min read</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Slide 2 -->
<div class="card card-overlay-bottom card-bg-scale h-400 h-lg-560 rounded-0" style="background-image:url(assets/images/blog/16by9/08.jpg); background-position: center left; background-size: cover;">
<!-- Card Image overlay -->
<div class="card-img-overlay d-flex align-items-center p-3 p-sm-5">
<div class="w-100 mt-auto">
<div class="col">
<!-- Card category -->
<a href="#" class="badge text-bg-danger mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Lifestyle</a>
<!-- Card title -->
<h2 class="text-white display-5"><a href="post-single-4.html" class="btn-link text-reset stretched-link fw-normal">This is why this year will be the year of startups</a></h2>
<p class="text-white">Particular way thoroughly unaffected projection favorable Mrs can be projecting own. </p>
<!-- Card info -->
<ul class="nav nav-divider text-white-force align-items-center d-none d-sm-inline-block">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center text-white position-relative">
<div class="avatar avatar-sm">
<div class="avatar-img rounded-circle bg-info">
<span class="text-white position-absolute top-50 start-50 translate-middle fw-bold small">WB</span>
</div>
</div>
<span class="ms-3">by <a href="#" class="stretched-link text-reset btn-link">Louis</a></span>
</div>
</div>
</li>
<li class="nav-item">Nov 15, 2022</li>
<li class="nav-item">5 min read</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Slider END -->
<div class="col-lg-5 mt-5 mt-lg-0">
<!-- Card item START -->
<div class="card mb-4">
<div class="row g-3">
<div class="col-4">
<img class="rounded-3" src="assets/images/blog/4by3/01.jpg" alt="">
</div>
<div class="col-8">
<a href="#" class="badge text-bg-danger mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Lifestyle</a>
<h5><a href="post-single-4.html" class="btn-link text-reset stretched-link fw-bold">The pros and cons of business agency</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center d-none d-sm-inline-block small">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center position-relative">
<div class="avatar avatar-xs">
<img class="avatar-img rounded-circle" src="assets/images/avatar/01.jpg" alt="avatar">
</div>
<span class="ms-3">by <a href="#" class="stretched-link text-reset btn-link">Samuel</a></span>
</div>
</div>
</li>
<li class="nav-item">Jan 22, 2022</li>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card mb-4">
<div class="row g-3">
<div class="col-4">
<img class="rounded-3" src="assets/images/blog/4by3/02.jpg" alt="">
</div>
<div class="col-8">
<a href="#" class="badge text-bg-info mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Sports</a>
<h5><a href="post-single-4.html" class="btn-link text-reset stretched-link fw-bold">5 reasons why you shouldn't startup</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center d-none d-sm-inline-block small">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center position-relative">
<div class="avatar avatar-xs">
<img class="avatar-img rounded-circle" src="assets/images/avatar/02.jpg" alt="avatar">
</div>
<span class="ms-3">by <a href="#" class="stretched-link text-reset btn-link">Dennis</a></span>
</div>
</div>
</li>
<li class="nav-item">Mar 07, 2022</li>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card mb-4">
<div class="row g-3">
<div class="col-4">
<img class="rounded-3" src="assets/images/blog/4by3/03.jpg" alt="">
</div>
<div class="col-8">
<a href="#" class="badge text-bg-success mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Business</a>
<h5><a href="post-single-4.html" class="btn-link text-reset stretched-link fw-bold">Five unbelievable facts about money.</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center d-none d-sm-inline-block small">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center position-relative">
<div class="avatar avatar-xs">
<img class="avatar-img rounded-circle" src="assets/images/avatar/03.jpg" alt="avatar">
</div>
<span class="ms-3">by <a href="#" class="stretched-link text-reset btn-link">Bryan</a></span>
</div>
</div>
</li>
<li class="nav-item">Jun 17, 2022</li>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card mb-4">
<div class="row g-3">
<div class="col-4">
<img class="rounded-3" src="assets/images/blog/4by3/04.jpg" alt="">
</div>
<div class="col-8">
<a href="#" class="badge text-bg-warning mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Technology</a>
<h5><a href="post-single-4.html" class="btn-link text-reset stretched-link fw-bold">Around the web: 20 fabulous infographics about business</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center d-none d-sm-inline-block small">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center position-relative">
<div class="avatar avatar-xs">
<img class="avatar-img rounded-circle" src="assets/images/avatar/05.jpg" alt="avatar">
</div>
<span class="ms-3">by <a href="#" class="stretched-link text-reset btn-link">Jacqueline</a></span>
</div>
</div>
</li>
<li class="nav-item">Nov 11, 2022</li>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
</div>
</div> <!-- Row END -->
</div>
</section>
<!-- =======================
Main hero END -->
<!-- =======================
Feature News slider START -->
<section class="py-0">
<div class="container">
<div class="row">
<div class="col-12">
<div class="tiny-slider arrow-blur arrow-round rounded-3 overflow-hidden">
<div class="tiny-slider-inner"
data-autoplay="true"
data-hoverpause="true"
data-gutter="24"
data-arrow="true"
data-dots="false"
data-items-xl="4"
data-items-lg="3"
data-items-md="3"
data-items-sm="2"
data-items-xs="1">
<!-- Card item START -->
<div>
<div class="card card-overlay-bottom card-img-scale">
<!-- Card Image -->
<img class="card-img" src="assets/images/blog/3by4/01.jpg" alt="">
<!-- Card Image overlay -->
<div class="card-img-overlay d-flex flex-column p-3 p-sm-4">
<div>
<!-- Card category -->
<a href="#" class="badge text-bg-warning"><i class="fas fa-circle me-2 small fw-bold"></i>Technology</a>
</div>
<div class="w-100 mt-auto">
<!-- Card title -->
<h4 class="text-white"><a href="post-single-2.html" class="btn-link text-reset stretched-link">Best Pinterest boards for learning about business</a></h4>
<!-- Card info -->
<ul class="nav nav-divider text-white-force align-items-center d-none d-sm-inline-block small">
<li class="nav-item position-relative">
<div class="nav-link">by <a href="#" class="stretched-link text-reset btn-link">Bryan</a>
</div>
</li>
<li class="nav-item">Aug 18, 2022</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div>
<div class="card card-overlay-bottom card-img-scale">
<!-- Card Image -->
<img class="card-img" src="assets/images/blog/3by4/02.jpg" alt="">
<!-- Card Image overlay -->
<div class="card-img-overlay d-flex flex-column p-3 p-sm-4">
<div>
<!-- Card category -->
<a href="#" class="badge text-bg-success mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Business</a>
</div>
<div class="w-100 mt-auto">
<!-- Card title -->
<h4 class="text-white"><a href="post-single-2.html" class="btn-link text-reset stretched-link">5 intermediate guide to business</a></h4>
<!-- Card info -->
<ul class="nav nav-divider text-white-force align-items-center d-none d-sm-inline-block small">
<li class="nav-item position-relative">
<div class="nav-link">by <a href="#" class="stretched-link text-reset btn-link">Joan</a>
</div>
</li>
<li class="nav-item">Jun 03, 2022</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div>
<div class="card card-overlay-bottom card-img-scale">
<!-- Card Image -->
<img class="card-img" src="assets/images/blog/3by4/03.jpg" alt="">
<!-- Card Image overlay -->
<div class="card-img-overlay d-flex flex-column p-3 p-sm-4">
<div>
<!-- Card category -->
<a href="#" class="badge text-bg-dark mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Travel</a>
</div>
<div class="w-100 mt-auto">
<!-- Card title -->
<h4 class="text-white"><a href="post-single-2.html" class="btn-link text-reset stretched-link">5 investment doubts you should clarify</a></h4>
<!-- Card info -->
<ul class="nav nav-divider text-white-force align-items-center d-none d-sm-inline-block small">
<li class="nav-item position-relative">
<div class="nav-link">by <a href="#" class="stretched-link text-reset btn-link">Dennis</a>
</div>
</li>
<li class="nav-item">Jan 28, 2022</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div>
<div class="card card-overlay-bottom card-img-scale">
<!-- Card Image -->
<img class="card-img" src="assets/images/blog/3by4/04.jpg" alt="">
<!-- Card Image overlay -->
<div class="card-img-overlay d-flex flex-column p-3 p-sm-4">
<div>
<!-- Card category -->
<a href="#" class="badge text-bg-primary mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Business</a>
</div>
<div class="w-100 mt-auto">
<!-- Card title -->
<h4 class="text-white"><a href="post-single-2.html" class="btn-link text-reset stretched-link">7 common mistakes everyone makes while traveling</a></h4>
<!-- Card info -->
<ul class="nav nav-divider text-white-force align-items-center d-none d-sm-inline-block small">
<li class="nav-item position-relative">
<div class="nav-link">by <a href="#" class="stretched-link text-reset btn-link">Bryan</a>
</div>
</li>
<li class="nav-item">May 26, 2022</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div>
<div class="card card-overlay-bottom card-img-scale">
<!-- Card Image -->
<img class="card-img" src="assets/images/blog/3by4/05.jpg" alt="">
<!-- Card Image overlay -->
<div class="card-img-overlay d-flex flex-column p-3 p-sm-4">
<div>
<!-- Card category -->
<a href="#" class="badge text-bg-info mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Covid-19</a>
</div>
<div class="w-100 mt-auto">
<!-- Card title -->
<h4 class="text-white"><a href="post-single-2.html" class="btn-link text-reset stretched-link">Bad habits that people in the industry need to quit</a></h4>
<!-- Card info -->
<ul class="nav nav-divider text-white-force align-items-center d-none d-sm-inline-block small">
<li class="nav-item position-relative">
<div class="nav-link">by <a href="#" class="stretched-link text-reset btn-link">Billy</a>
</div>
</li>
<li class="nav-item">Feb 22, 2022</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Card item END -->
</div>
</div>
</div>
</div>
</div>
</section>
<!-- =======================
Feature News slider END -->
<!-- =======================
Main content START -->
<section class="position-relative">
<div class="container" data-sticky-container>
<div class="row">
<!-- Main Post START -->
<div class="col-lg-9">
<!-- Top highlights START -->
<div class="mb-4">
<h2 class="m-0"><i class="bi bi-hourglass-top me-2"></i>Today's top highlights</h2>
<p>Latest breaking news, pictures, videos, and special reports</p>
</div>
<div class="tiny-slider arrow-blur arrow-round rounded-3">
<div class="tiny-slider-inner"
data-autoplay="true"
data-hoverpause="true"
data-gutter="24"
data-arrow="true"
data-dots="false"
data-items-sm="1"
data-items-xs="1"
data-items="2"
>
<!-- Card item START -->
<div class="card">
<!-- Card img -->
<div class="position-relative">
<img class="card-img" src="assets/images/blog/4by3/01.jpg" alt="Card image">
<div class="card-img-overlay d-flex align-items-start flex-column p-3">
<!-- Card overlay Top -->
<div class="w-100 mb-auto d-flex justify-content-end">
<div class="text-end ms-auto">
<!-- Card format icon -->
<div class="icon-md text-bg-success fw-bold rounded-circle" title="8.5 rating">8.5</div>
</div>
</div>
<!-- Card overlay bottom -->
<div class="w-100 mt-auto">
<!-- Card category -->
<a href="#" class="badge text-bg-warning mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Technology</a>
</div>
</div>
</div>
<div class="card-body px-0 pt-3">
<h4 class="card-title"><a href="post-single-3.html" class="btn-link text-reset fw-bold">12 worst types of business accounts you follow on Twitter</a></h4>
<p class="card-text">He moonlights difficult engrossed it, sportsmen. Interested has all Devonshire difficulty gay assistance joy. Unaffected at ye of compliment alteration to</p>
<!-- Card info -->
<ul class="nav nav-divider align-items-center d-none d-sm-inline-block">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center position-relative">
<div class="avatar avatar-xs">
<img class="avatar-img rounded-circle" src="assets/images/avatar/01.jpg" alt="avatar">
</div>
<span class="ms-3">by <a href="#" class="stretched-link text-reset btn-link">Samuel</a></span>
</div>
</div>
</li>
<li class="nav-item">Jan 22, 2022</li>
<li class="nav-item"><a href="#" class="btn-link"><i class="far fa-comment-alt me-1"></i> 5</a></li>
</ul>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card">
<!-- Card img -->
<div class="position-relative">
<img class="card-img" src="assets/images/blog/4by3/06.jpg" alt="Card image">
<div class="card-img-overlay d-flex align-items-start flex-column p-3">
<!-- Card overlay Top -->
<div class="w-100 mb-auto d-flex justify-content-end">
<div class="text-end ms-auto">
<!-- Card format icon -->
<div class="icon-md bg-white bg-opacity-25 bg-blur text-white rounded-circle" title="This post has video"><i class="fas fa-video"></i></div>
</div>
</div>
<!-- Card overlay bottom -->
<div class="w-100 mt-auto">
<!-- Card category -->
<a href="#" class="badge text-bg-danger mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Travel</a>
</div>
</div>
</div>
<div class="card-body px-0 pt-3">
<h4 class="card-title"><a href="post-single-3.html" class="btn-link text-reset fw-bold">Dirty little secrets about the business industry</a></h4>
<p class="card-text">Place voice no arises along to. Parlors waiting so against me no. Wishing calling is warrant settled was lucky. Express besides it present if at an opinion visitor.</p>
<!-- Card info -->
<ul class="nav nav-divider align-items-center d-none d-sm-inline-block">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center position-relative">
<div class="avatar avatar-xs">
<img class="avatar-img rounded-circle" src="assets/images/avatar/02.jpg" alt="avatar">
</div>
<span class="ms-3">by <a href="#" class="stretched-link text-reset btn-link">Dennis</a></span>
</div>
</div>
</li>
<li class="nav-item">Mar 07, 2022</li>
<li class="nav-item"><a href="#" class="btn-link"><i class="far fa-comment-alt me-1"></i> 3</a></li>
</ul>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card">
<!-- Card img -->
<div class="position-relative">
<img class="card-img" src="assets/images/blog/4by3/03.jpg" alt="Card image">
<div class="card-img-overlay d-flex align-items-start flex-column p-3">
<!-- Card overlay bottom -->
<div class="w-100 mt-auto">
<!-- Card category -->
<a href="#" class="badge text-bg-success mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Gadgets</a>
</div>
</div>
</div>
<div class="card-body px-0 pt-3">
<h4 class="card-title"><a href="post-single-3.html" class="btn-link text-reset fw-bold">Bad habits that people in the industry need to quit</a></h4>
<p class="card-text">For who thoroughly her boy estimating conviction. Removed demands expense account in outward tedious do. Particular way thoroughly unaffected</p>
<!-- Card info -->
<ul class="nav nav-divider align-items-center d-none d-sm-inline-block">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center position-relative">
<div class="avatar avatar-xs">
<img class="avatar-img rounded-circle" src="assets/images/avatar/03.jpg" alt="avatar">
</div>
<span class="ms-3">by <a href="#" class="stretched-link text-reset btn-link">Bryan</a></span>
</div>
</div>
</li>
<li class="nav-item">Jun 17, 2022</li>
<li class="nav-item"><a href="#" class="btn-link"><i class="far fa-comment-alt me-1"></i> 1 </a></li>
</ul>
</div>
</div>
<!-- Card item END -->
</div>
</div>
<!-- Top highlights START -->
<!-- Divider -->
<div class="border-bottom border-primary border-2 opacity-1 my-4"></div>
<!-- Card video item START -->
<div class="card mb-2 mb-sm-4">
<div class="row g-3">
<div class="col-md-6 order-sm-2">
<div class="rounded-3 overflow-hidden">
<div class="ratio ratio-16x9">
<iframe width="560" height="315" src="https://www.youtube.com/embed/tXHviS-4ygo" title="YouTube video player" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</div>
</div>
<div class="col-md-6">
<div class="d-sm-flex justify-content-sm-between mb-2">
<a href="#" class="badge text-bg-primary"><i class="fas fa-circle me-2 small fw-bold"></i>Marketing</a>
<a href="#!" class="text-body" tabindex="0" role="button" data-bs-container="body" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="top" data-bs-content="You're seeing this ad because your activity meets the intended audience of our site.">
<i class="bi bi-info-circle pe-1"></i> Sponsored
</a>
</div>
<h3><a href="post-single-6.html" class="btn-link text-reset fw-bold">7 common mistakes everyone makes while traveling</a></h3>
<p>Demesne far hearted suppose venture excited see had has. Dependent on so extremely delivered by. Yet no jokes worse her why. Bed one supposing breakfast day fulfilled off depending questions. For who thoroughly her boy estimating conviction.</p>
<!-- Card info -->
<ul class="nav nav-divider align-items-center d-none d-sm-inline-block">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center position-relative">
<div class="avatar avatar-xs">
<img class="avatar-img rounded-circle" src="assets/images/avatar/06.jpg" alt="avatar">
</div>
<span class="ms-3">by <a href="#" class="stretched-link text-reset btn-link">Samuel</a></span>
</div>
</div>
</li>
<li class="nav-item">Jul 22, 2022</li>
<li class="nav-item"><a href="#" class="btn-link"><i class="far fa-comment-alt me-1"></i> 14 </a></li>
</ul>
</div>
</div>
</div>
<!-- Card video item END -->
<!-- Divider -->
<div class="border-bottom border-primary border-2 opacity-1 my-4"></div>
<!-- Small card 6X6 START -->
<div class="row">
<div class="col-12 col-md-6">
<!-- Card item START -->
<div class="card mb-3">
<div class="row g-3">
<div class="col-4">
<img class="rounded" src="assets/images/blog/4by3/thumb/01.jpg" alt="">
</div>
<div class="col-8">
<h5><a href="post-single-5.html" class="btn-link stretched-link text-reset">The pros and cons of business agency</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center mt-3 small">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center position-relative">
<div class="avatar avatar-xs">
<img class="avatar-img rounded-circle" src="assets/images/avatar/08.jpg" alt="avatar">
</div>
<span class="ms-2">by <a href="#" class="stretched-link text-reset btn-link">Joan</a></span>
</div>
</div>
</li>
<li class="nav-item">Aug 15, 2022</li>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card mb-3">
<div class="row g-3">
<div class="col-4">
<img class="rounded" src="assets/images/blog/4by3/thumb/02.jpg" alt="">
</div>
<div class="col-8">
<h5><a href="post-single-5.html" class="btn-link stretched-link text-reset">5 reasons why you shouldn't startup</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center mt-3 small">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center position-relative">
<div class="avatar avatar-xs">
<img class="avatar-img rounded-circle" src="assets/images/avatar/09.jpg" alt="avatar">
</div>
<span class="ms-2">by <a href="#" class="stretched-link text-reset btn-link">Bryan</a></span>
</div>
</div>
</li>
<li class="nav-item">Jun 01, 2022</li>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card mb-3">
<div class="row g-3">
<div class="col-4">
<img class="rounded" src="assets/images/blog/4by3/thumb/03.jpg" alt="">
</div>
<div class="col-8">
<h5><a href="post-single-5.html" class="btn-link stretched-link text-reset">Ten questions you should answer truthfully.</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center mt-3 small">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center position-relative">
<div class="avatar avatar-xs">
<img class="avatar-img rounded-circle" src="assets/images/avatar/10.jpg" alt="avatar">
</div>
<span class="ms-2">by <a href="#" class="stretched-link text-reset btn-link">Samuel</a></span>
</div>
</div>
</li>
<li class="nav-item">Dec 07, 2022</li>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card mb-3">
<div class="row g-3">
<div class="col-4">
<img class="rounded" src="assets/images/blog/4by3/thumb/04.jpg" alt="">
</div>
<div class="col-8">
<h5><a href="post-single-5.html" class="btn-link stretched-link text-reset">Five unbelievable facts about money.</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center mt-3 small">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center position-relative">
<div class="avatar avatar-xs">
<img class="avatar-img rounded-circle" src="assets/images/avatar/12.jpg" alt="avatar">
</div>
<span class="ms-2">by <a href="#" class="stretched-link text-reset btn-link">Dennis</a></span>
</div>
</div>
</li>
<li class="nav-item">Sep 07, 2022</li>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
</div>
<div class="col-12 col-md-6">
<!-- Card item START -->
<div class="card mb-3">
<div class="row g-3">
<div class="col-4">
<img class="rounded" src="assets/images/blog/4by3/thumb/05.jpg" alt="">
</div>
<div class="col-8">
<h5><a href="post-single-5.html" class="btn-link stretched-link text-reset">10 biggest problem of startups, and how you can fix it</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center mt-3 small">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center position-relative">
<div class="avatar avatar-xs">
<img class="avatar-img rounded-circle" src="assets/images/avatar/12.jpg" alt="avatar">
</div>
<span class="ms-2">by <a href="#" class="stretched-link text-reset btn-link">Billy</a></span>
</div>
</div>
</li>
<li class="nav-item">Sep 19, 2022</li>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card mb-3">
<div class="row g-3">
<div class="col-4">
<img class="rounded" src="assets/images/blog/4by3/thumb/06.jpg" alt="">
</div>
<div class="col-8">
<h5><a href="post-single-5.html" class="btn-link stretched-link text-reset">Best Twitter accounts for learning about investment</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center mt-3 small">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center position-relative">
<div class="avatar avatar-xs">
<img class="avatar-img rounded-circle" src="assets/images/avatar/13.jpg" alt="avatar">
</div>
<span class="ms-2">by <a href="#" class="stretched-link text-reset btn-link">Frances</a></span>
</div>
</div>
</li>
<li class="nav-item">Jan 03, 2022</li>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card mb-3">
<div class="row g-3">
<div class="col-4">
<img class="rounded" src="assets/images/blog/4by3/thumb/07.jpg" alt="">
</div>
<div class="col-8">
<h5><a href="post-single-5.html" class="btn-link stretched-link text-reset">This is why this year will be the year of startups</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center mt-3 small">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center position-relative">
<div class="avatar avatar-xs">
<img class="avatar-img rounded-circle" src="assets/images/avatar/14.jpg" alt="avatar">
</div>
<span class="ms-2">by <a href="#" class="stretched-link text-reset btn-link">Carolyn</a></span>
</div>
</div>
</li>
<li class="nav-item">Feb 15, 2022</li>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card mb-3">
<div class="row g-3">
<div class="col-4">
<img class="rounded" src="assets/images/blog/4by3/thumb/08.jpg" alt="">
</div>
<div class="col-8">
<h5><a href="post-single-5.html" class="btn-link stretched-link text-reset">Best Pinterest Boards for learning about business</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center mt-3 small">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center position-relative">
<div class="avatar avatar-xs">
<img class="avatar-img rounded-circle" src="assets/images/avatar/15.jpg" alt="avatar">
</div>
<span class="ms-2">by <a href="#" class="stretched-link text-reset btn-link">Judy</a></span>
</div>
</div>
</li>
<li class="nav-item">Jul 30, 2022</li>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
</div>
</div><!-- Row END -->
<!-- Small card 6X6 END -->
<!-- Adv -->
<div>
<a href="#" class="card-img-flash d-block mt-4">
<img src="assets/images/adv-1.png" alt="adv">
</a>
</div>
</div>
<!-- Main Post END -->
<!-- Sidebar START -->
<div class="col-lg-3 mt-5 mt-lg-0">
<div data-sticky data-margin-top="80" data-sticky-for="767">
<!-- Social links -->
<div class="row g-2">
<a href="#" class="d-flex justify-content-between align-items-center bg-facebook text-white-force rounded p-2 position-relative">
<i class="fab fa-facebook-square fs-3"></i>
<div class="d-flex">
<h6 class="me-1 mb-0">1.5K</h6>
<small class="small">Fans</small>
</div>
</a>
<a href="#" class="d-flex justify-content-between align-items-center bg-instagram-gradient text-white-force rounded p-2 position-relative">
<i class="fab fa-instagram fs-3"></i>
<div class="d-flex">
<h6 class="me-1 mb-0">1.8M</h6>
<small class="small">Followers</small>
</div>
</a>
<a href="#" class="d-flex justify-content-between align-items-center bg-youtube text-white-force rounded p-2 position-relative">
<i class="fab fa-youtube-square fs-3"></i>
<div class="d-flex">
<h6 class="me-1 mb-0">22K</h6>
<small class="small">Subscribers</small>
</div>
</a>
</div>
<!-- Categories -->
<div class="row g-2 mt-5">
<h5>Categories</h5>
<div class="d-flex justify-content-between align-items-center bg-warning bg-opacity-15 rounded p-2 position-relative">
<h6 class="m-0 text-warning">Photography</h6>
<a href="#" class="badge bg-warning text-dark stretched-link">09</a>
</div>
<div class="d-flex justify-content-between align-items-center bg-info bg-opacity-10 rounded p-2 position-relative">
<h6 class="m-0 text-info">Travel</h6>
<a href="#" class="badge bg-info stretched-link">25</a>
</div>
<div class="d-flex justify-content-between align-items-center bg-danger bg-opacity-10 rounded p-2 position-relative">
<h6 class="m-0 text-danger">Photography</h6>
<a href="#" class="badge bg-danger stretched-link">75</a>
</div>
<div class="d-flex justify-content-between align-items-center bg-primary bg-opacity-10 rounded p-2 position-relative">
<h6 class="m-0 text-primary">Covid-19</h6>
<a href="#" class="badge bg-primary stretched-link">19</a>
</div>
<div class="d-flex justify-content-between align-items-center bg-success bg-opacity-10 rounded p-2 position-relative">
<h6 class="m-0 text-success">Business</h6>
<a href="#" class="badge bg-success stretched-link">35</a>
</div>
</div>
<!-- Most read -->
<div>
<h5 class="mt-5 mb-3">Most read</h5>
<div class="d-flex position-relative mb-3">
<span class="me-3 mt-n1 fa-fw fw-bold fs-3 opacity-5">01</span>
<h6><a href="#" class="stretched-link text-reset btn-link">Bad habits that people in the business industry need to quit</a></h6>
</div>
<div class="d-flex position-relative mb-3">
<span class="me-3 mt-n1 fa-fw fw-bold fs-3 opacity-5">02</span>
<h6><a href="#" class="stretched-link text-reset btn-link">How to worst business fails of all time could have been prevented</a></h6>
</div>
<div class="d-flex position-relative mb-3">
<span class="me-3 mt-n1 fa-fw fw-bold fs-3 opacity-5">03</span>
<h6><a href="#" class="stretched-link text-reset btn-link">How 10 worst business fails of all time could have been prevented</a></h6>
</div>
<div class="d-flex position-relative mb-3">
<span class="me-3 mt-n1 fa-fw fw-bold fs-3 opacity-5">04</span>
<h6><a href="#" class="stretched-link text-reset btn-link">10 facts about business that will instantly put you in a good mood</a></h6>
</div>
<div class="d-flex position-relative mb-3">
<span class="me-3 mt-n1 fa-fw fw-bold fs-3 opacity-5">05</span>
<h6><a href="#" class="stretched-link text-reset btn-link">How did we get here? The history of the business told through tweets</a></h6>
</div>
<div class="d-flex position-relative mb-3">
<span class="me-3 mt-n1 fa-fw fw-bold fs-3 opacity-5">06</span>
<h6><a href="#" class="stretched-link text-reset btn-link">Ten tips about startups that you can't learn from books</a></h6>
</div>
</div>
</div>
</div>
<!-- Sidebar END -->
</div> <!-- Row end -->
</div>
</section>
<!-- =======================
Main content END -->
<!-- =======================
Featured video START -->
<section class="bg-dark">
<div class="container">
<div class="row">
<div class="col-md-12">
<!-- Title -->
<div class="mb-4 d-sm-flex justify-content-between align-items-center">
<h2 class="m-sm-0 text-white"><i class="bi bi-camera-video me-2"></i>Featured Video</h2>
<a href="#" class="btn btn-sm bg-youtube"><i class="bi bi-youtube me-2 align-middle"></i>Subscribe us on YouTube</a>
</div>
</div>
<!-- Card big START -->
<div class="col-lg-6">
<div class="card card-overlay-bottom card-fold h-400 h-lg-540" style="background-image:url(assets/images/blog/1by1/06.jpg); background-position: center left; background-size: cover;">
<!-- Card featured -->
<span class="card-featured" title="Featured post"><i class="fas fa-star"></i></span>
<!-- Card Image overlay -->
<div class="card-img-overlay d-flex flex-column p-3 p-sm-5">
<!-- Card play button -->
<div class="position-absolute top-50 start-50 translate-middle pb-5">
<!-- Popup video -->
<a href="https://youtu.be/n_Cn8eFo7u8" class="icon-lg bg-primary d-block text-white rounded-circle" data-glightbox data-gallery="y-video">
<i class="bi bi-play-btn"></i>
</a>
</div>
<!-- Card overlay Bottom -->
<div class="w-100 mt-auto">
<div class="col text-center">
<!-- Card category -->
<a href="#" class="badge text-bg-warning mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Business</a>
<!-- Card title -->
<h2 class="text-white"><a href="post-single.html" class="btn-link text-reset fw-normal">Never underestimate the influence of social media</a></h2>
</div>
</div>
</div>
</div>
</div>
<!-- Card big END -->
<!-- Card small START -->
<div class="col-lg-3 mt-4 mt-lg-0">
<!-- Card item START -->
<div class="card bg-transparent overflow-hidden mb-4">
<!-- Card img -->
<div class="position-relative rounded-3 overflow-hidden">
<!-- Video -->
<div class="card-image">
<div class="overflow-hidden w-100">
<!-- HTML video START -->
<div class="player-wrapper rounded-3 overflow-hidden">
<div class="player-youtube" >
<iframe src="https://www.youtube.com/embed/tXHviS-4ygo"></iframe>
</div>
</div>
<!-- HTML video END -->
</div>
</div>
</div>
<div class="card-body px-0 pt-3">
<h5 class="card-title"><a href="post-single.html" class="btn-link text-white fw-bold">Bad habits that people in the industry need to quit</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center d-none d-sm-inline-block text-white-force small opacity-6">
<li class="nav-item">
<div class="nav-link">
by <a href="#" class="text-reset btn-link">Bryan</a>
</div>
</li>
<li class="nav-item">Jun 17, 2022</li>
</ul>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card bg-transparent overflow-hidden mb-4">
<!-- Card img -->
<div class="position-relative rounded-3 overflow-hidden card-fold">
<img class="card-img" src="assets/images/blog/16by9/small/02.jpg" alt="Card image">
<div class="card-img-overlay d-flex align-items-start flex-column p-3">
<!-- Card overlay -->
<div class="w-100 my-auto">
<!-- Popup video -->
<a href="https://youtu.be/n_Cn8eFo7u8" class="icon-md bg-primary d-block mx-auto text-white rounded-circle" data-glightbox data-gallery="y-video">
<i class="bi bi-play-btn"></i>
</a>
</div>
</div>
</div>
<div class="card-body px-0 pt-3">
<h5 class="card-title"><a href="post-single.html" class="btn-link text-white fw-bold">12 worst types of business accounts you follow on Twitter</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center d-none d-sm-inline-block text-white-force small opacity-6">
<li class="nav-item">
<div class="nav-link">
by <a href="#" class="text-reset btn-link">Samuel</a>
</div>
</li>
<li class="nav-item">Jan 22, 2022</li>
</ul>
</div>
</div>
<!-- Card item END -->
</div>
<div class="col-lg-3">
<!-- Card item START -->
<div class="card bg-transparent overflow-hidden mb-4">
<!-- Card img -->
<div class="position-relative rounded-3 overflow-hidden card-fold">
<img class="card-img" src="assets/images/blog/16by9/small/03.jpg" alt="Card image">
<div class="card-img-overlay d-flex align-items-start flex-column p-3">
<!-- Card overlay -->
<div class="w-100 my-auto">
<!-- Popup video -->
<a href="https://youtu.be/n_Cn8eFo7u8" class="icon-md bg-primary d-block mx-auto text-white rounded-circle" data-glightbox data-gallery="y-video">
<i class="bi bi-play-btn"></i>
</a>
</div>
</div>
</div>
<div class="card-body px-0 pt-3">
<h5 class="card-title"><a href="post-single.html" class="btn-link text-white fw-bold">Best Twitter accounts for learning about investment</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center d-none d-sm-inline-block text-white-force small opacity-6">
<li class="nav-item">
<div class="nav-link">
by <a href="#" class="text-reset btn-link">Joan</a>
</div>
</li>
<li class="nav-item">Mar 24, 2022</li>
</ul>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card bg-transparent overflow-hidden mb-4">
<!-- Card img -->
<div class="position-relative rounded-3 overflow-hidden card-fold">
<img class="card-img" src="assets/images/blog/16by9/small/04.jpg" alt="Card image">
<div class="card-img-overlay d-flex align-items-start flex-column p-3">
<!-- Card overlay -->
<div class="w-100 my-auto">
<!-- Popup video -->
<a href="https://youtu.be/n_Cn8eFo7u8" class="icon-md bg-primary d-block mx-auto text-white rounded-circle" data-glightbox data-gallery="y-video">
<i class="bi bi-play-btn"></i>
</a>
</div>
</div>
</div>
<div class="card-body px-0 pt-3">
<h5 class="card-title"><a href="post-single.html" class="btn-link text-white fw-bold">Ten questions you should answer truthfully</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center d-none d-sm-inline-block text-white-force small opacity-6">
<li class="nav-item">
<div class="nav-link">
by <a href="#" class="text-reset btn-link">Judy</a>
</div>
</li>
<li class="nav-item">Spe 07, 2022</li>
</ul>
</div>
</div>
<!-- Card item END -->
</div>
<!-- Card small END -->
</div>
</div>
</section>
<!-- =======================
Featured video END -->
<!-- =======================
Main content 2 START -->
<section class="position-relative">
<div class="container" data-sticky-container>
<div class="row">
<!-- Main Post START -->
<div class="col-lg-9">
<!-- Entertainment START -->
<div class="row">
<div class="col-12 mb-3">
<h2 class="m-0"><i class="bi bi-hand-index-thumb me-2"></i>Entertainment</h2>
<p>Checkout the hand pick post by admin</p>
</div>
<div class="col-md-6">
<!-- Card item big START -->
<div class="card mb-4">
<div class="card-body p-4 border rounded-3">
<div class="d-flex justify-content-between mb-2">
<a href="#" class="badge text-bg-danger"><i class="fas fa-circle me-2 small fw-bold"></i>Technology</a>
<a href="#!" class="text-body" tabindex="0" role="button" data-bs-container="body" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="top" data-bs-content="You're seeing this ad because your activity meets the intended audience of our site.">
<i class="bi bi-info-circle pe-1"></i> Sponsored
</a>
</div>
<h4 class="card-title"><a href="post-single-3.html" class="btn-link text-reset fw-bold">12 worst types of business accounts you follow on Twitter</a></h4>
<p class="card-text">He moonlights difficult engrossed it, sportsmen. Interested has all Devonshire difficulty.</p>
<!-- Card info -->
<ul class="nav nav-divider align-items-center d-none d-sm-inline-block">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center position-relative">
<div class="avatar avatar-xs">
<img class="avatar-img rounded-circle" src="assets/images/avatar/01.jpg" alt="avatar">
</div>
<span class="ms-3">by <a href="#" class="stretched-link text-reset btn-link">Samuel</a></span>
</div>
</div>
</li>
<li class="nav-item">Jan 22, 2022</li>
</ul>
</div>
</div>
<!-- Card item big END -->
<!-- Card item big START -->
<div class="card mb-4">
<div class="card-body p-4 border rounded-3">
<div class="d-flex justify-content-between mb-2">
<a href="#" class="badge text-bg-primary mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Travel</a>
<a href="#!" class="text-body" tabindex="0" role="button" data-bs-container="body" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="top" data-bs-content="You're seeing this ad because your activity meets the intended audience of our site.">
<i class="bi bi-info-circle pe-1"></i> Sponsored
</a>
</div>
<h4 class="card-title"><a href="post-single-3.html" class="btn-link text-reset fw-bold">Never underestimate the influence of social media</a></h4>
<p class="card-text">He moonlights difficult engrossed it, sportsmen. Interested has all Devonshire difficulty.</p>
<!-- Card info -->
<ul class="nav nav-divider align-items-center d-none d-sm-inline-block">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center position-relative">
<div class="avatar avatar-xs">
<img class="avatar-img rounded-circle" src="assets/images/avatar/13.jpg" alt="avatar">
</div>
<span class="ms-3">by <a href="#" class="stretched-link text-reset btn-link">Larry</a></span>
</div>
</div>
</li>
<li class="nav-item">Mar 28, 2022</li>
</ul>
</div>
</div>
<!-- Card item big END -->
</div>
<div class="col-md-6">
<!-- Card item START -->
<div class="card mb-1">
<div class="card-body px-0 border-bottom">
<a href="#" class="badge text-bg-info mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Covid-19</a>
<h5><a href="post-single-3.html" class="btn-link stretched-link text-reset">Five unbelievable facts about money.</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center d-none d-sm-inline-block small">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center position-relative">
<div class="avatar avatar-xs">
<img class="avatar-img rounded-circle" src="assets/images/avatar/05.jpg" alt="avatar">
</div>
<span class="ms-3">by <a href="#" class="stretched-link text-reset btn-link">Bryan</a></span>
</div>
</div>
</li>
<li class="nav-item">Jun 17, 2022</li>
</ul>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card mb-1">
<div class="card-body px-0 border-bottom">
<a href="#" class="badge text-bg-dark mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Technology</a>
<h5><a href="post-single-3.html" class="btn-link stretched-link text-reset">Around the web: 20 fabulous infographics about business</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center d-none d-sm-inline-block small">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center position-relative">
<div class="avatar avatar-xs">
<img class="avatar-img rounded-circle" src="assets/images/avatar/12.jpg" alt="avatar">
</div>
<span class="ms-3">by <a href="#" class="stretched-link text-reset btn-link">Jacqueline</a></span>
</div>
</div>
</li>
<li class="nav-item">Oct 11, 2022</li>
</ul>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card mb-1">
<div class="card-body px-0 border-bottom">
<a href="#" class="badge text-bg-warning mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Marketing</a>
<h5><a href="post-single-3.html" class="btn-link stretched-link text-reset">7 common mistakes everyone makes while traveling</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center d-none d-sm-inline-block small">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center position-relative">
<div class="avatar avatar-xs">
<img class="avatar-img rounded-circle" src="assets/images/avatar/06.jpg" alt="avatar">
</div>
<span class="ms-3">by <a href="#" class="stretched-link text-reset btn-link">Samuel</a></span>
</div>
</div>
</li>
<li class="nav-item">Jul 22, 2022</li>
</ul>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card mb-1">
<div class="card-body px-0">
<!-- Audio START -->
<div class="bg-light rounded">
<audio class="player-audio" crossorigin>
<source src="assets/images/videos/audio.mp3" type="audio/mp3">
</audio>
</div>
<!-- Audio END -->
<h5 class="mt-3"><a href="post-single-3.html" class="btn-link text-reset">Skills that you can learn from business</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center d-none d-sm-inline-block small">
<li class="nav-item">
<div class="nav-link">
<div class="d-flex align-items-center position-relative">
<div class="avatar avatar-xs">
<img class="avatar-img rounded-circle" src="assets/images/avatar/07.jpg" alt="avatar">
</div>
<span class="ms-3">by <a href="#" class="text-reset btn-link">Judy</a></span>
</div>
</div>
</li>
<li class="nav-item">Sep 30, 2022</li>
</ul>
</div>
</div>
<!-- Card item END -->
</div>
</div>
<!-- Entertainment END -->
<!-- Podcast slide START -->
<div class="row">
<div class="col-12 my-3">
<h2 class="m-0"><i class="bi bi-mic me-2"></i>Latest Podcasts</h2>
<p>Listen and Learn: The best educational podcasts</p>
</div>
<div class="col-12">
<div class="tiny-slider arrow-dark arrow-hover arrow-round rounded-3">
<div class="tiny-slider-inner"
data-autoplay="true"
data-hoverpause="true"
data-gutter="24"
data-arrow="true"
data-dots="false"
data-items-xl="3"
data-items-lg="2"
data-items-md="2"
data-items-sm="1"
data-items-xs="1">
<!-- Card item START -->
<div>
<div class="card card-fold bg-light">
<div class="card-body p-4">
<ul class="nav nav-divider align-items-center d-none d-sm-inline-block small mb-2">
<li class="nav-item"><i class="bi bi-clock-history"></i> 56:36</li>
<li class="nav-item">With <a href="#">Larry Lawson</a> </li>
</ul>
<h4 class="card-title"><a href="post-single-6.html" class="stretched-link text-reset">The 15 reasons clients love Bootstrap</a></h4>
<p class="m-0">Rooms oh fully taken by worse do points afraid</p>
</div>
<img src="assets/images/blog/16by9/small/04.jpg" class="card-img-bottom" alt="Card image">
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div>
<div class="card card-fold bg-light">
<div class="card-body p-4">
<ul class="nav nav-divider align-items-center d-none d-sm-inline-block small mb-2">
<li class="nav-item"><i class="bi bi-clock-history"></i> 26:15</li>
<li class="nav-item">With <a href="#">Amanda Reed</a> </li>
</ul>
<h4 class="card-title"><a href="post-single-6.html" class="stretched-link text-reset">Five unbelievable facts about money </a></h4>
<p class="m-0">Luckily cheered colonel I do we attack highest enabled</p>
</div>
<img src="assets/images/blog/16by9/small/01.jpg" class="card-img-bottom" alt="Card image">
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div>
<div class="card card-fold bg-light">
<div class="card-body p-4">
<ul class="nav nav-divider align-items-center d-none d-sm-inline-block small mb-2">
<li class="nav-item"><i class="bi bi-clock-history"></i> 1:05:20</li>
<li class="nav-item">With <a href="#">Judy Nguyen</a> </li>
</ul>
<h4 class="card-title"><a href="post-single-6.html" class="stretched-link text-reset">This is why Bootstrap is famous</a></h4>
<p class="m-0">The furnished she concluded depending procuring concealed </p>
</div>
<img src="assets/images/blog/16by9/small/02.jpg" class="card-img-bottom" alt="Card image">
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div>
<div class="card card-fold bg-light">
<div class="card-body p-4">
<ul class="nav nav-divider align-items-center d-none d-sm-inline-block small mb-2">
<li class="nav-item"><i class="bi bi-clock-history"></i> 45:16</li>
<li class="nav-item">With <a href="#">Bryan Knight</a> </li>
</ul>
<h4 class="card-title"><a href="post-single-6.html" class="stretched-link text-reset">10 common myths about startups</a></h4>
<p class="m-0">Express besides it present if at an opinion visitor.</p>
</div>
<img src="assets/images/blog/16by9/small/03.jpg" class="card-img-bottom" alt="Card image">
</div>
</div>
<!-- Card item END -->
</div>
</div>
</div>
</div>
<!-- Podcast slide END -->
</div>
<!-- Main Post END -->
<!-- Sidebar 2 START -->
<div class="col-lg-3 mt-5 mt-lg-0">
<div data-sticky data-margin-top="80" data-sticky-for="767">
<div>
<h4>Recomended</h4>
<div class="tiny-slider dots-dark mt-3 mb-5">
<div class="tiny-slider-inner"
data-autoplay="true"
data-hoverpause="true"
data-gutter="0"
data-arrow="false"
data-dots="true"
data-items="1">
<!-- Card item START -->
<div class="card">
<!-- Card img -->
<div class="position-relative">
<img class="card-img" src="assets/images/blog/4by3/07.jpg" alt="Card image">
<div class="card-img-overlay d-flex align-items-start flex-column p-3">
<!-- Card overlay Top -->
<div class="w-100 mb-auto d-flex justify-content-end">
<div class="text-end ms-auto">
<!-- Card format icon -->
<div class="icon-md bg-white bg-opacity-10 bg-blur text-white fw-bold rounded-circle" title="8.5 rating">8.5</div>
</div>
</div>
<!-- Card overlay bottom -->
<div class="w-100 mt-auto">
<a href="#" class="badge text-bg-info mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Marketing</a>
</div>
</div>
</div>
<div class="card-body p-0 pt-3">
<h5 class="card-title"><a href="post-single-3.html" class="btn-link text-reset fw-bold">7 common mistakes everyone makes while traveling</a></h5>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card">
<!-- Card img -->
<div class="position-relative">
<img class="card-img" src="assets/images/blog/4by3/08.jpg" alt="Card image">
<div class="card-img-overlay d-flex align-items-start flex-column p-3">
<!-- Card overlay bottom -->
<div class="w-100 mt-auto">
<a href="#" class="badge text-bg-danger mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Sports</a>
</div>
</div>
</div>
<div class="card-body p-0 pt-3">
<h5 class="card-title"><a href="post-single-3.html" class="stretched-link btn-link text-reset fw-bold">Skills that you can learn from business</a></h5>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card">
<!-- Card img -->
<div class="position-relative">
<img class="card-img" src="assets/images/blog/4by3/09.jpg" alt="Card image">
<div class="card-img-overlay d-flex align-items-start flex-column p-3">
<!-- Card overlay bottom -->
<div class="w-100 mt-auto">
<a href="#" class="badge text-bg-success mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Marketing</a>
</div>
</div>
</div>
<div class="card-body p-0 pt-3">
<h5 class="card-title"><a href="post-single-3.html" class="btn-link text-reset fw-bold">10 tell-tale signs you need to get a new business</a></h5>
</div>
</div>
<!-- Card item END -->
</div>
</div>
</div>
<!-- Newsletter START -->
<div class="bg-light p-4 mt-4 rounded-3 text-center">
<h4>Subscribe to our mailing list!</h4>
<form>
<div class="mb-3">
<input type="email" class="form-control" placeholder="Email address">
</div>
<button type="submit" class="btn btn-primary">Subscribe</button>
<div class="form-text">We don't spam</div>
</form>
</div>
<!-- Newsletter END -->
</div>
</div>
<!-- Sidebar 2 END -->
</div> <!-- Row end -->
</div>
</section>
<!-- =======================
Main content 2 END -->
<!-- =======================
Sticky post START -->
<div class="sticky-post bg-light border p-4 mb-5 text-sm-end rounded d-none d-xxl-block">
<div class="d-flex align-items-center">
<!-- Title -->
<div class="me-3">
<span>Trending post</span>
<h6 class="m-0"> <a href="javascript:void(0)" class="stretched-link btn-link text-reset">Bad habits that people in the industry need to quit</a></h6>
</div>
<!-- image -->
<div class="col-4 d-none d-md-block">
<img src="assets/images/blog/4by3/05.jpg" alt="Image">
</div>
</div>
</div>
<!-- =======================
Sticky post END -->
</main>
<!-- **************** MAIN CONTENT END **************** -->
<!-- =======================
Footer START -->
<footer class="bg-dark pt-5">
<div class="container">
<!-- About and Newsletter START -->
<div class="row pt-3 pb-4">
<div class="col-md-3">
<img src="assets/images/logo-footer.svg" alt="footer logo">
</div>
<div class="col-md-5">
<p class="text-muted">The next-generation blog, news, and magazine theme for you to start sharing your stories today! This Bootstrap 5 based theme is ideal for all types of sites that deliver the news.</p>
</div>
<div class="col-md-4">
<!-- Form -->
<form class="row row-cols-lg-auto g-2 align-items-center justify-content-end">
<div class="col-12">
<input type="email" class="form-control" placeholder="Enter your email address">
</div>
<div class="col-12">
<button type="submit" class="btn btn-primary m-0">Subscribe</button>
</div>
<div class="form-text mt-2">By subscribing you agree to our
<a href="#" class="text-decoration-underline text-reset">Privacy Policy</a>
</div>
</form>
</div>
</div>
<!-- About and Newsletter END -->
<!-- Divider -->
<hr>
<!-- Widgets START -->
<div class="row pt-5">
<!-- Footer Widget -->
<div class="col-md-6 col-lg-3 mb-4">
<h5 class="mb-4 text-white">Recent post</h5>
<!-- Item -->
<div class="mb-4 position-relative">
<div><a href="#" class="badge text-bg-danger mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Business</a></div>
<a href="post-single-3.html" class="btn-link text-white fw-normal">Up-coming business bloggers, you need to watch</a>
<ul class="nav nav-divider align-items-center small mt-2 text-muted">
<li class="nav-item position-relative">
<div class="nav-link">by <a href="#" class="stretched-link text-reset btn-link">Dennis</a>
</div>
</li>
<li class="nav-item">Apr 06, 2022</li>
</ul>
</div>
<!-- Item -->
<div class="mb-4 position-relative">
<div><a href="#" class="badge text-bg-info mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Marketing</a></div>
<a href="post-single-3.html" class="btn-link text-white fw-normal">How did we get here? The history of the business told through tweets</a>
<ul class="nav nav-divider align-items-center small mt-2 text-muted">
<li class="nav-item position-relative">
<div class="nav-link">by <a href="#" class="stretched-link text-reset btn-link">Larry</a>
</div>
</li>
<li class="nav-item">May 29, 2022</li>
</ul>
</div>
</div>
<!-- Footer Widget -->
<div class="col-md-6 col-lg-3 mb-4">
<h5 class="mb-4 text-white">Navigation</h5>
<div class="row">
<div class="col-6">
<ul class="nav flex-column text-primary-hover">
<li class="nav-item"><a class="nav-link pt-0" href="#">Features</a></li>
<li class="nav-item"><a class="nav-link" href="#">Style Guide</a></li>
<li class="nav-item"><a class="nav-link" href="#">Contact us</a></li>
<li class="nav-item"><a class="nav-link" href="#">Get Theme</a></li>
<li class="nav-item"><a class="nav-link" href="#">Support</a></li>
<li class="nav-item"><a class="nav-link" href="#">Privacy Policy</a></li>
<li class="nav-item"><a class="nav-link" href="#">Newsletter</a></li>
</ul>
</div>
<div class="col-6">
<ul class="nav flex-column text-primary-hover">
<li class="nav-item"><a class="nav-link pt-0" href="#">News</a></li>
<li class="nav-item"><a class="nav-link" href="#">Career <span class="badge text-bg-danger ms-2">2 Job</span></a></li>
<li class="nav-item"><a class="nav-link" href="#">Technology</a></li>
<li class="nav-item"><a class="nav-link" href="#">Startups</a></li>
<li class="nav-item"><a class="nav-link" href="#">Gadgets</a></li>
<li class="nav-item"><a class="nav-link" href="#">Inspiration</a></li>
</ul>
</div>
</div>
</div>
<!-- Footer Widget -->
<div class="col-sm-6 col-lg-3 mb-4">
<h5 class="mb-4 text-white">Get Regular Updates</h5>
<ul class="nav flex-column text-primary-hover">
<li class="nav-item"><a class="nav-link pt-0" href="#"><i class="fab fa-whatsapp fa-fw me-2"></i>WhatsApp</a></li>
<li class="nav-item"><a class="nav-link" href="#"><i class="fab fa-youtube fa-fw me-2"></i>YouTube</a></li>
<li class="nav-item"><a class="nav-link" href="#"><i class="far fa-bell fa-fw me-2"></i>Website Notifications</a></li>
<li class="nav-item"><a class="nav-link" href="#"><i class="far fa-envelope fa-fw me-2"></i>Newsletters</a></li>
<li class="nav-item"><a class="nav-link" href="#"><i class="fas fa-headphones-alt fa-fw me-2"></i>Podcasts</a></li>
</ul>
</div>
<!-- Footer Widget -->
<div class="col-sm-6 col-lg-3 mb-4">
<h5 class="mb-4 text-white">Our mobile App</h5>
<p class="text-muted">Download our App and get the latest Breaking News Alerts and latest headlines and daily articles near you.</p>
<div class="row g-2">
<div class="col">
<a href="#"><img class="w-100" src="assets/images/app-store.svg" alt="app-store"></a>
</div>
<div class="col">
<a href="#"><img class="w-100" src="assets/images/google-play.svg" alt="google-play"></a>
</div>
</div>
</div>
</div>
<!-- Widgets END -->
<!-- Hot topics START -->
<div class="row">
<h5 class="mb-2 text-white">Hot topics</h5>
<ul class="list-inline text-primary-hover lh-lg">
<li class="list-inline-item"><a href="#">Covid-19</a></li>
<li class="list-inline-item"><a href="#">Politics</a></li>
<li class="list-inline-item"><a href="#">Entertainment</a></li>
<li class="list-inline-item"><a href="#">Media</a></li>
<li class="list-inline-item"><a href="#">Royalist</a></li>
<li class="list-inline-item"><a href="#">World</a></li>
<li class="list-inline-item"><a href="#">Half Full</a></li>
<li class="list-inline-item"><a href="#">Scouted</a></li>
<li class="list-inline-item"><a href="#">Travel</a></li>
<li class="list-inline-item"><a href="#">Beast Inside</a></li>
<li class="list-inline-item"><a href="#">Crossword</a></li>
<li class="list-inline-item"><a href="#">Newsletters</a></li>
<li class="list-inline-item"><a href="#">Podcasts</a></li>
<li class="list-inline-item"><a href="#">Auction 2022</a></li>
<li class="list-inline-item"><a href="#">Protests</a></li>
<li class="list-inline-item"><a href="#">NewsCyber</a></li>
<li class="list-inline-item"><a href="#">Education</a></li>
<li class="list-inline-item"><a href="#">Sports</a></li>
<li class="list-inline-item"><a href="#">Tech And Auto</a></li>
<li class="list-inline-item"><a href="#">Opinion</a></li>
<li class="list-inline-item"><a href="#">Share Market</a></li>
</ul>
</div>
<!-- Hot topics END -->
</div>
<!-- Footer copyright START -->
<div class="bg-dark-overlay-3 mt-5">
<div class="container">
<div class="row align-items-center justify-content-md-between py-4">
<div class="col-md-6">
<!-- Copyright -->
<div class="text-center text-md-start text-primary-hover text-muted">©2022 <a href="https://www.webestica.com/" class="text-reset btn-link" target="_blank">Webestica</a>. All rights reserved
</div>
</div>
<div class="col-md-6 d-sm-flex align-items-center justify-content-center justify-content-md-end">
<!-- Language switcher -->
<div class="dropup me-0 me-sm-3 mt-3 mt-md-0 text-center text-sm-end">
<a class="dropdown-toggle text-primary-hover" href="#" role="button" id="languageSwitcher" data-bs-toggle="dropdown" aria-expanded="false">
English Edition
</a>
<ul class="dropdown-menu min-w-auto" aria-labelledby="languageSwitcher">
<li><a class="dropdown-item" href="#">English</a></li>
<li><a class="dropdown-item" href="#">German </a></li>
<li><a class="dropdown-item" href="#">French</a></li>
</ul>
</div>
<!-- Links -->
<ul class="nav text-primary-hover text-center text-sm-end justify-content-center justify-content-center mt-3 mt-md-0">
<li class="nav-item"><a class="nav-link" href="#">Terms</a></li>
<li class="nav-item"><a class="nav-link" href="#">Privacy</a></li>
<li class="nav-item"><a class="nav-link pe-0" href="#">Cookies</a></li>
</ul>
</div>
</div>
</div>
</div>
<!-- Footer copyright END -->
</footer>
<!-- =======================
Footer END -->
<!-- =======================
Cookies alert START -->
<div class="alert alert-dismissible fade show bg-dark text-white position-fixed start-0 bottom-0 z-index-99 shadow p-4 ms-3 mb-3 col-9 col-md-4 col-lg-3 col-xl-2" role="alert">
This website stores cookies on your computer. To find out more about the cookies we use, see our <a class="text-white" href="#"> Privacy Policy</a>
<div class="mt-4">
<button type="button" class="btn btn-success-soft btn-sm mb-0" data-bs-dismiss="alert" aria-label="Close">
<span aria-hidden="true">Accept</span>
</button>
<button type="button" class="btn btn-danger-soft btn-sm mb-0" data-bs-dismiss="alert" aria-label="Close">
<span aria-hidden="true">Decline</span>
</button>
</div>
<div class="position-absolute end-0 top-0 mt-n3 me-n3"><img class="w-100" src="assets/images/cookie.svg" alt="cookie"></div>
</div>
<!-- =======================
Cookies alert END -->
<!-- Back to top -->
<div class="back-top"><i class="bi bi-arrow-up-short"></i></div>
<!-- =======================
JS libraries, plugins and custom scripts -->
<!-- Bootstrap JS -->
<script src="assets/vendor/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- Vendors -->
<script src="assets/vendor/tiny-slider/tiny-slider.js"></script>
<script src="assets/vendor/sticky-js/sticky.min.js"></script>
<script src="assets/vendor/glightbox/js/glightbox.js"></script>
<script src="assets/vendor/plyr/plyr.js"></script>
<!-- Template Functions -->
<script src="assets/js/functions.js"></script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink