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

1394 lines
63 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">
<!-- Theme CSS -->
<link id="style-switch" rel="stylesheet" type="text/css" href="assets/css/style.css">
</head>
<body>
<!-- =======================
Header START -->
<header class="navbar-light navbar-sticky header-static">
<!-- Logo Nav START -->
<nav class="navbar navbar-expand-lg">
<div class="container">
<!-- Logo START -->
<a class="navbar-brand" href="index.html">
<img class="navbar-brand-item light-mode-item" src="assets/images/logo.svg" alt="logo">
<img class="navbar-brand-item dark-mode-item" src="assets/images/logo-light.svg" alt="logo">
</a>
<!-- Logo END -->
<!-- Responsive navbar toggler -->
<button class="navbar-toggler ms-auto" type="button" data-bs-toggle="collapse" data-bs-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
<span class="text-body h6 d-none d-sm-inline-block">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 ms-auto">
<!-- 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 active" href="index-2.html">Magazine classic</a></li>
<li> <a class="dropdown-item" 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="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 ms-sm-3 flex-nowrap align-items-center">
<!-- Dark mode switch -->
<div class="nav-item">
<div class="modeswitch" id="darkModeSwitch">
<div class="switch"></div>
</div>
</div>
<!-- Nav additional link -->
<div class="nav-item dropdown dropdown-toggle-icon-none d-none d-sm-block">
<a class="nav-link dropdown-toggle" role="button" href="#" id="navAdditionalLink" data-bs-toggle="dropdown" aria-expanded="false">
<i class="bi bi-three-dots fs-4"></i>
</a>
<ul class="dropdown-menu dropdown-menu-end min-w-auto shadow rounded text-end" aria-labelledby="navAdditionalLink">
<li><a class="dropdown-item fw-normal" href="#">About</a></li>
<li><a class="dropdown-item fw-normal" href="#">Newsletter</a></li>
<li><a class="dropdown-item fw-normal" href="#">Author</a></li>
<li><a class="dropdown-item fw-normal" href="#">#Tags</a></li>
<li><a class="dropdown-item fw-normal" href="#">Contact</a></li>
<li><a class="dropdown-item fw-normal" href="#"><span class="badge bg-danger me-2 align-middle">2 Job</span>Careers</a></li>
</ul>
</div>
<!-- Nav Button -->
<div class="nav-item d-none d-md-block">
<a href="#" class="btn btn-sm btn-danger mb-0 mx-2">Subscribe!</a>
</div>
<!-- Nav Search -->
<div class="nav-item dropdown nav-search dropdown-toggle-icon-none">
<a class="nav-link pe-0 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>
</div>
<!-- Nav right END -->
</div>
</nav>
<!-- Logo Nav END -->
</header>
<!-- =======================
Header END -->
<!-- **************** MAIN CONTENT START **************** -->
<main>
<!-- =======================
Main hero START -->
<section class="p-0">
<div class="container-fluid">
<div class="row g-0">
<div class="col-xxl-10 mx-auto rounded-3 overflow-hidden">
<div class="tiny-slider arrow-hover arrow-blur arrow-round position-relative">
<div class="tiny-slider-inner"
data-autoplay="false"
data-hoverpause="true"
data-gutter="2"
data-arrow="false"
data-dots="true"
data-items="1">
<!-- Slide item -->
<div class="card bg-dark-overlay-3 rounded-0 h-400 h-lg-500 h-xl-700 position-relative overflow-hidden" style="background-image:url(assets/images/blog/16by9/big/02.jpg); background-position: center left; background-size: cover;">
<!-- Card Image overlay -->
<div class="card-img-overlay rounded-0 d-flex align-items-center">
<div class="container px-3 my-auto">
<div class="row">
<div class="col-lg-7">
<!-- 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 fw-normal">10 tell-tale signs you need to get a new startup.</a></h2>
<p class="text-white">No visited raising gravity outward subject my cottage Mr be. Hold do at tore in park feet near my case. </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/11.jpg" alt="avatar">
</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">Jan 01, 2022</li>
<li class="nav-item">5 min read</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- Slide item -->
<div class="card bg-dark-overlay-3 rounded-0 h-400 h-lg-500 h-xl-700 position-relative overflow-hidden" style="background-image:url(assets/images/blog/16by9/big/01.jpg); background-position: center left; background-size: cover;">
<!-- Card Image overlay -->
<div class="card-img-overlay rounded-0 d-flex align-items-center">
<div class="container px-3 my-auto">
<div class="row">
<div class="col-lg-7">
<!-- Card category -->
<a href="#" class="badge text-bg-warning mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Travel</a>
<!-- Card title -->
<h2 class="text-white display-5"><a href="post-single-6.html" class="btn-link text-reset fw-normal">7 common mistakes everyone makes while traveling</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">
<img class="avatar-img rounded-circle" src="assets/images/avatar/11.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">Feb 22, 2022</li>
<li class="nav-item">2 min read</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- Slide item -->
<div class="card bg-dark-overlay-3 rounded-0 h-400 h-lg-500 h-xl-700 position-relative overflow-hidden" style="background-image:url(assets/images/blog/16by9/big/03.jpg); background-position: center left; background-size: cover;">
<!-- Card Image overlay -->
<div class="card-img-overlay rounded-0 d-flex align-items-center">
<div class="container w-100 my-auto">
<div class="row">
<div class="col-lg-7">
<!-- Card category -->
<a href="#" class="badge bg-primary mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Covid-19</a>
<!-- Card title -->
<h2 class="text-white display-5"><a href="post-single-4.html" class="btn-link text-reset fw-normal">Initial problem of startups and their solution</a></h2>
<p class="text-white"> Thirty it matter enable become admire in giving. See resolved goodness felicity shy civility domestic. </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/08.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">Jun 17, 2022</li>
<li class="nav-item">10 min read</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Custom thumb START -->
<div class="col-xl-4 custom-thumb pe-5 position-absolute top-50 end-0 translate-middle-y d-none d-xxl-block" id="custom-thumb">
<!-- Thumb 1 -->
<div class="row align-items-center g-3 mb-4">
<div class="col-auto">
<div class="avatar avatar-lg">
<img class="avatar-img rounded-circle" src="assets/images/blog/16by9/big/02.jpg" alt="avatar">
</div>
</div>
<div class="col-8">
<h4 class="fw-normal text-truncate mb-1">Tell-tale signs you need to get a new startup</h4>
<p class="text-truncate d-block col-11 small mb-0">Departure defective arranging rapturous did believe</p>
</div>
</div>
<!-- Thumb 2 -->
<div class="row align-items-center g-3 mb-4">
<div class="col-auto">
<div class="avatar avatar-lg">
<img class="avatar-img rounded-circle" src="assets/images/blog/16by9/big/01.jpg" alt="avatar">
</div>
</div>
<div class="col-8">
<h4 class="fw-normal text-truncate mb-1">7 common mistakes everyone makes while traveling</h4>
<p class="text-truncate d-block col-11 small mb-0">Particular way thoroughly unaffected projection favorable </p>
</div>
</div>
<!-- Thumb 3 -->
<div class="row align-items-center g-3">
<div class="col-auto">
<div class="avatar avatar-lg">
<img class="avatar-img rounded-circle" src="assets/images/blog/16by9/big/03.jpg" alt="avatar">
</div>
</div>
<div class="col-8">
<h4 class="fw-normal text-truncate mb-1">Initial problem of startups and their solution</h4>
<p class="text-truncate d-block col-11 small mb-0">Drawings offended yet answered Jennings perceive</p>
</div>
</div>
</div>
<!-- Custom thumb END -->
</div>
</div>
</div>
</div>
</section>
<!-- =======================
Main hero END -->
<!-- =======================
Highlights START -->
<section class="pt-4">
<div class="container">
<div class="row">
<div class="col-md-12">
<!-- Title -->
<div class="mb-4">
<h2 class="m-0"><i class="bi bi-megaphone"></i> Today's top highlights</h2>
<p class="m-0">Latest breaking news, pictures, videos, and special reports</p>
</div>
<div class="tiny-slider arrow-hover arrow-blur arrow-dark arrow-round mt-3">
<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 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 px-0 pt-3">
<h5 class="card-title"><a href="post-single-6.html" class="btn-link text-reset fw-bold">7 common mistakes everyone makes while traveling</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center">
<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="stretched-link text-reset btn-link">Lori</a></span>
</div>
</div>
</li>
<li class="nav-item">Mar 07, 2022</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/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 px-0 pt-3">
<h5 class="card-title"><a href="post-single-6.html" class="btn-link text-reset fw-bold">Skills that you can learn from business</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center">
<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-3">by <a href="post-single-6.html" class="stretched-link text-reset btn-link">Joan</a></span>
</div>
</div>
</li>
<li class="nav-item">Aug 15, 2022</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/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 px-0 pt-3">
<h5 class="card-title"><a href="post-single-6.html" class="btn-link text-reset fw-bold">10 tell-tale signs you need to get a new business</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center">
<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-3">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>
<!-- Card item END -->
<!-- Card item START -->
<div class="card">
<!-- Card img -->
<div class="position-relative">
<img class="card-img" src="assets/images/blog/4by3/10.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-soft bg-blur text-white rounded-circle" title="This post has images"><i class="fas fa-image"></i></div>
</div>
</div>
<!-- Card overlay bottom -->
<div class="w-100 mt-auto">
<a href="#" class="badge text-bg-primary mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Photography</a>
</div>
</div>
</div>
<div class="card-body px-0 pt-3">
<h5 class="card-title"><a href="post-single-6.html" class="btn-link text-reset fw-bold">This is why this year will be the year of startups</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center">
<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-3">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>
<!-- Card item END -->
<!-- Card item START -->
<div class="card">
<!-- Card img -->
<div class="position-relative">
<img class="card-img" src="assets/images/blog/4by3/11.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-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">
<h5 class="card-title"><a href="post-single-6.html" class="btn-link text-reset fw-bold">Best Pinterest Boards for learning about business</a></h5>
<!-- Card info -->
<ul class="nav nav-divider align-items-center">
<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">Dennis</a></span>
</div>
</div>
</li>
<li class="nav-item">Sep 07, 2022</li>
</ul>
</div>
</div>
<!-- Card item END -->
</div>
</div>
</div>
</div>
</div>
</section>
<!-- =======================
Highlights END -->
<!-- =======================
Adv START -->
<section class="p-0">
<div class="container">
<div class="row">
<div class="col">
<a href="#" class="d-block card-img-flash">
<img src="assets/images/adv-3.png" alt="">
</a>
<small class="text-end d-block mt-1">Advertisement</small>
</div>
</div>
</div>
</section>
<!-- =======================
Adv END -->
<!-- =======================
Top highlights START -->
<section>
<div class="container">
<div class="row">
<div class="col">
<!-- Title -->
<div class="mb-4">
<h2 class="m-0"><i class="bi bi-bookmark-star me-2"></i>Last week top highlights</h2>
<p class="m-0">Check last weeks top highlights, news, stories and headline news</p>
</div>
<div class="row gy-4">
<div class="col-lg-7">
<div class="card card-overlay-bottom card-bg-scale h-400 h-lg-560" style="background-image:url(assets/images/blog/16by9/05.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-primary mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Business</a>
<a href="#!" class="badge mb-2 text-bg-dark z-index-99 position-relative" 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>
<!-- Card title -->
<h2 class="text-white display-6"><a href="post-single-5.html" class="btn-link text-reset stretched-link fw-normal">Never underestimate the influence of social media</a></h2>
<!-- 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>
</div>
<div class="col-lg-5">
<!-- Card item START -->
<div class="card mb-2 mb-md-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 bg-danger bg-opacity-10 text-danger mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Lifestyle</a>
<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 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">
<div class="avatar-img rounded-circle bg-primary bg-opacity-10">
<span class="text-primary position-absolute top-50 start-50 translate-middle fw-bold small">PT</span>
</div>
</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-2 mb-md-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 bg-info bg-opacity-10 text-info mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Sports</a>
<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 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>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card mb-2 mb-md-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 bg-success bg-opacity-10 text-success mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Business</a>
<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 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>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card mb-2 mb-md-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 bg-warning bg-opacity-15 text-warning mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Technology</a>
<h5><a href="post-single-5.html" class="btn-link stretched-link text-reset 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">
<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>
</div> <!-- Row END -->
</div>
</section>
<!-- =======================
Top highlights END -->
<!-- =======================
Trending topics START -->
<section class="p-0">
<div class="container">
<div class="row g-0">
<div class="col-12 bg-light p-2 p-sm-4 rounded-3">
<!-- Title -->
<div class="d-sm-flex justify-content-between align-items-center mb-4">
<h2 class="m-0">Trending topics</h2>
<a href="#" class="text-body text-primary-hover"><u>View all categories</u></a>
</div>
<!-- Slider -->
<div class="tiny-slider arrow-hover arrow-dark arrow-blur arrow-round">
<div class="tiny-slider-inner"
data-autoplay="false"
data-hoverpause="true"
data-gutter="24"
data-arrow="true"
data-dots="false"
data-items-xl="5"
data-items-lg="4"
data-items-md="3"
data-items-sm="2"
data-items-xs="2"
>
<!-- Category item -->
<div>
<div class="card card-overlay-bottom card-img-scale">
<img class="card-img" src="assets/images/blog/1by1/thumb/01.jpg" alt="card image">
<div class="card-img-overlay d-flex px-3 px-sm-5">
<h5 class="mt-auto mx-auto">
<a href="#" class="stretched-link btn-link fw-bold text-white">Travel</a>
</h5>
</div>
</div>
</div>
<!-- Category item -->
<div>
<div class="card card-overlay-bottom card-img-scale">
<img class="card-img" src="assets/images/blog/1by1/thumb/02.jpg" alt="card image">
<div class="card-img-overlay d-flex px-3 px-sm-5">
<h5 class="mt-auto mx-auto">
<a href="#" class="stretched-link btn-link fw-bold text-white">Business</a>
</h5>
</div>
</div>
</div>
<!-- Category item -->
<div>
<div class="card card-overlay-bottom card-img-scale">
<img class="card-img" src="assets/images/blog/1by1/thumb/03.jpg" alt="card image">
<div class="card-img-overlay d-flex px-3 px-sm-5">
<h5 class="mt-auto mx-auto">
<a href="#" class="stretched-link btn-link fw-bold text-white">Marketing</a>
</h5>
</div>
</div>
</div>
<!-- Category item -->
<div>
<div class="card card-overlay-bottom card-img-scale">
<img class="card-img" src="assets/images/blog/1by1/thumb/04.jpg" alt="card image">
<div class="card-img-overlay d-flex px-3 px-sm-5">
<h5 class="mt-auto mx-auto">
<a href="#" class="stretched-link btn-link fw-bold text-white">Photography</a>
</h5>
</div>
</div>
</div>
<!-- Category item -->
<div>
<div class="card card-overlay-bottom card-img-scale">
<img class="card-img" src="assets/images/blog/1by1/thumb/05.jpg" alt="card image">
<div class="card-img-overlay d-flex px-3 px-sm-5">
<h5 class="mt-auto mx-auto">
<a href="#" class="stretched-link btn-link fw-bold text-white">Sports</a>
</h5>
</div>
</div>
</div>
</div>
</div> <!-- Slider END -->
</div>
</div>
</div>
</section>
<!-- =======================
Trending topics END -->
<!-- =======================
Sports update START -->
<section>
<div class="container">
<div class="row">
<!-- Title -->
<div class="col-12 mb-4">
<h2 class="m-0"><i class="bi bi-controller me-2"></i>Sports update</h2>
<p class="m-0">Get the latest sports news and updates from football, tennis, formula one, cricket, NBA, and golf with live scores and stats</p>
</div>
</div>
<div class="row">
<div class="col-md-6 mb-4 mb-md-0">
<!-- Card item START -->
<div class="card card-overlay-bottom card-bg-scale h-300 h-lg-540" style="background-image:url(assets/images/blog/16by9/06.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-4">
<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>Travel</a>
<!-- Card title -->
<h2 class="text-white display-6"><a href="post-single-4.html" class="btn-link text-reset stretched-link fw-normal">8 initial problem of startups and their solution</a></h2>
<!-- 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-primary">
<span class="text-white position-absolute top-50 start-50 translate-middle fw-bold small">VP</span>
</div>
</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">Feb 28, 2022</li>
<li class="nav-item">6 min read</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Card item END -->
</div>
<div class="col-md-6">
<!-- Card item START -->
<div class="card card-overlay-bottom card-bg-scale h-300 h-lg-540" style="background-image:url(assets/images/blog/16by9/01.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-4">
<div class="w-100 mt-auto">
<div class="col">
<!-- Card category -->
<a href="#" class="badge text-bg-warning mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Technology</a>
<!-- Card title -->
<h2 class="text-white display-6"><a href="post-single-4.html" class="btn-link text-reset stretched-link fw-normal">Business ideas that will boom in upcoming years</a></h2>
<!-- 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/09.jpg" alt="avatar">
</div>
<span class="ms-3">by <a href="#" class="stretched-link text-reset btn-link">Billy</a></span>
</div>
</div>
</li>
<li class="nav-item">Jul 19, 2022</li>
<li class="nav-item">2 min read</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Card item END -->
</div>
</div>
</div>
</section>
<!-- =======================
Sports update END -->
<!-- =======================
Sponsored news START -->
<section class="pt-4">
<div class="container">
<div class="row">
<!-- Title -->
<div class="col-md-12">
<div class="mb-4 d-md-flex justify-content-between align-items-center">
<h2 class="m-0"><i class="bi bi-megaphone me-2"></i> Sponsored news</h2>
<a href="#" class="text-body small"><u>Content by: Bootstrap</u></a>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-6">
<!-- Card item START -->
<div class="card mb-3 mb-sm-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 bg-danger bg-opacity-10 text-danger mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Lifestyle</a>
<h4><a href="post-single-5.html" class="btn-link stretched-link text-reset fw-bold">The pros and cons of business agency</a></h4>
<!-- 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>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card mb-3 mb-sm-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 bg-info bg-opacity-10 text-info mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Sports</a>
<h4><a href="post-single-5.html" class="btn-link stretched-link text-reset fw-bold">5 reasons why you shouldn't startup</a></h4>
<!-- 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>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card mb-3 mb-sm-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 bg-success bg-opacity-10 text-success mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Business</a>
<h4><a href="post-single-5.html" class="btn-link stretched-link text-reset fw-bold">Five unbelievable facts about money.</a></h4>
<!-- 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>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
</div>
<div class="col-lg-6">
<!-- Card item START -->
<div class="card mb-3 mb-sm-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 bg-warning bg-opacity-15 text-warning mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Technology</a>
<h4><a href="post-single-2.html" class="btn-link stretched-link text-reset fw-bold">Around the web: 20 fabulous infographics about business</a></h4>
<!-- 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/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">Oct 11, 2022</li>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card mb-3 mb-sm-4">
<div class="row g-3">
<div class="col-4">
<img class="rounded-3" src="assets/images/blog/4by3/05.jpg" alt="">
</div>
<div class="col-8">
<a href="#" class="badge bg-primary bg-opacity-10 text-primary mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Marketing</a>
<h4><a href="post-single-6.html" class="btn-link stretched-link text-reset fw-bold">7 common mistakes everyone makes while traveling</a></h4>
<!-- 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">
<div class="avatar-img rounded-circle bg-danger">
<span class="text-white position-absolute top-50 start-50 translate-middle fw-bold small">W</span>
</div>
</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>
</div>
<!-- Card item END -->
<!-- Card item START -->
<div class="card mb-3 mb-sm-4">
<div class="row g-3">
<div class="col-4">
<img class="rounded-3" src="assets/images/blog/4by3/06.jpg" alt="">
</div>
<div class="col-8">
<a href="#" class="badge bg-danger bg-opacity-10 text-danger mb-2"><i class="fas fa-circle me-2 small fw-bold"></i>Photography</a>
<h4><a href="post-single-5.html" class="btn-link stretched-link text-reset fw-bold">5 investment doubts you should clarify</a></h4>
<!-- 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/07.jpg" alt="avatar">
</div>
<span class="ms-3">by <a href="#" class="stretched-link text-reset btn-link">Judy</a></span>
</div>
</div>
</li>
<li class="nav-item">Sep 30, 2022</li>
</ul>
</div>
</div>
</div>
<!-- Card item END -->
</div>
</div>
</div>
</section>
<!-- =======================
Sponsored news END -->
<!-- =======================
Newsletter START -->
<section class="pt-0">
<div class="container">
<div class="row">
<div class="col">
<div class="bg-dark p-3 p-sm-5 rounded-3 position-relative overflow-hidden">
<!-- SVG shape START -->
<figure class="position-absolute top-50 start-50 translate-middle">
<svg width="1848" height="481" viewBox="0 0 1848.9 481.8" xmlns="http://www.w3.org/2000/svg">
<path class="fill-success" d="m779.4 251c-10.3-11.5-19.9-23.8-29.4-36.1-9-11.6-18.4-22.8-27.1-34.7-15.3-21.2-30.2-45.8-54.8-53.3-10.5-3.2-21.6-3.2-30.6 2.5-7.6 4.8-13 12.6-17.3 20.9-10.8 20.6-16.1 44.7-24.6 66.7-7.9 20.2-19.4 38.6-33.8 54.3-14.7 16.2-31.7 30-50.4 41-15.9 9.4-33.4 17.2-52 19.3-18.4 2-38-2.5-56.5-6.2-22.4-4.4-45.1-9.7-67.6-10.9-9.8-0.5-19.8-0.3-29.1 2.3-9.8 2.8-18.7 8.6-26.6 15.2-17.3 14.5-30.2 34.4-43.7 52.9-12.9 17.6-26.8 34.9-45.4 45.4-19.5 11-42.6 12.1-65 6.6-52.3-13.1-93.8-56.5-127.9-101.5-8.8-11.6-17.3-23.4-25.6-35.4-0.6-0.9-1.1-1.8-1.6-2.7-1.1-2.4-0.9-2.6 0.6-1.2 1 0.9 1.9 1.9 2.7 3 35.3 47.4 71.5 98.5 123.2 123.9 22.8 11.2 48.2 17.2 71.7 12.2 23-5 40.6-21.2 55.3-39.7 24.5-30.7 46.5-75.6 87.1-83 19.5-3.5 40.7 0.1 60.6 3.7 21.2 3.9 42.3 9.1 63.6 11.7 17.8 2.3 35.8-0.1 52.2-7 20-8.1 38.4-20.2 54.8-34.6 16.2-14.1 31-30.7 41.8-50.4 11.1-20.2 17-43.7 24.9-65.7 6.1-16.9 13.8-36.2 29.3-44.5 16.1-8.6 37.3-1.9 52.3 10.6 18.7 15.6 31.2 39.2 46.7 58.2"/>
<path class="fill-warning" d="m1157.9 344.9c9.8 7.6 18.9 15.8 28.1 24 8.6 7.7 17.6 15.2 26 23.2 14.8 14.2 29.5 30.9 51.2 34.7 9.3 1.6 18.8 0.9 26.1-3.8 6.1-3.9 10.2-9.9 13.2-16.2 7.6-15.6 10.3-33.2 15.8-49.6 5.2-15.1 13.6-29 24.7-41.3 11.4-12.6 24.8-23.6 40-32.8 12.9-7.8 27.3-14.6 43.1-17.3 15.6-2.6 32.8-0.7 49 0.7 19.6 1.7 39.4 4 58.8 3.4 8.4-0.3 17-1.1 24.8-3.6 8.2-2.7 15.4-7.4 21.6-12.7 13.7-11.6 23.1-26.7 33.3-40.9 9.6-13.5 20.2-26.9 35.3-35.6 15.8-9.2 35.6-11.6 55.2-9.1 45.7 5.8 84.8 34.3 117.6 64.4 8.7 8 17.2 16.2 25.6 24.6 2.5 3.2 1.9 3-1.2 1-34.3-32-69.7-66.9-116.5-81.9-20.5-6.5-42.7-9.2-62.4-4-19.3 5.1-33.1 17.9-44.3 32.2-18.5 23.7-33.9 57.5-68.1 65.5-16.5 3.8-34.9 2.6-52.3 1.3-18.5-1.4-37-3.7-55.4-4.2-15.5-0.5-30.7 2.5-44.2 8.5-16.5 7.2-31.3 17.1-44.3 28.5-12.8 11.2-24.1 24.1-31.9 39-7.9 15.3-11.1 32.5-16.2 48.9-3.9 12.6-9 26.9-21.6 33.9-13.1 7.3-31.9 3.8-45.7-4.1-17.2-10-29.9-26.1-44.6-38.8"/>
<path class="fill-warning opacity-6" d="m1840.8 379c-8.8 40.3-167.8 79.9-300.2 45.3-42.5-11.1-91.4-32-138.7-11.6-38.7 16.7-55 66-90.8 67.4-25.1 1-48.6-20.3-58.1-39.8-31-63.3 50.7-179.9 155.7-208.1 50.4-13.5 97.3-3.2 116.1 1.6 36.3 9.3 328.6 87.4 316 145.2z"/>
<path class="fill-success opacity-6" d="M368.3,247.3C265.6,257.2,134,226,110.9,141.5C85,47.2,272.5-9.4,355.5-30.7s182.6-31.1,240.8-18.6 C677.6-31.8,671.5,53.9,627,102C582.6,150.2,470.9,237.5,368.3,247.3z"/>
</svg>
</figure>
<!-- SVG shape END -->
<div class="row">
<div class="col-md-8 col-lg-6 mx-auto text-center py-5 position-relative">
<!-- Title -->
<h2 class="display-5 text-white">Never miss a story!</h2>
<p class="text-white">Get the freshest headlines and updates sent uninterrupted to your inbox.</p>
<!-- Form -->
<form class="row row-cols-sm-auto g-2 align-items-center justify-content-center mt-3">
<div class="col-12">
<input type="email" class="form-control form-control-lg" placeholder="Enter your email address">
</div>
<div class="col-12">
<button type="submit" class="btn btn-primary btn-lg m-0">Subscribe</button>
</div>
<div class="form-text text-white opacity-6 mt-2">By subscribing you agree to our
<a href="#" class="text-decoration-underline text-reset">Privacy Policy</a>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- =======================
Newsletter END -->
</main>
<!-- **************** MAIN CONTENT END **************** -->
<!-- =======================
Footer START -->
<footer class="pb-0">
<div class="container">
<hr>
<!-- Widgets START -->
<div class="row pt-5">
<!-- Footer Widget -->
<div class="col-md-6 col-lg-4 mb-4">
<img class="light-mode-item" src="assets/images/logo.svg" alt="logo">
<img class="dark-mode-item" src="assets/images/logo-light.svg" alt="logo">
<p class="mt-3">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 class="mt-4">©2022 <a href="https://www.webestica.com/" class="text-reset btn-link" target="_blank">Webestica</a>. All rights reserved
</div>
</div>
<!-- Footer Widget -->
<div class="col-md-6 col-lg-3 mb-4">
<h5 class="mb-4">Navigation</h5>
<div class="row">
<div class="col-6">
<ul class="nav flex-column">
<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>
</ul>
</div>
<div class="col-6">
<ul class="nav flex-column">
<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>
</ul>
</div>
</div>
</div>
<!-- Footer Widget -->
<div class="col-sm-6 col-lg-3 mb-4">
<h5 class="mb-4">Browse by Tag</h5>
<ul class="list-inline">
<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-warning-soft">Marketing</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>
<!-- Footer Widget -->
<div class="col-sm-6 col-lg-2 mb-4">
<h5 class="mb-4">Our Social handles</h5>
<ul class="nav flex-column">
<li class="nav-item"><a class="nav-link pt-0" href="#"><i class="fab fa-facebook-square fa-fw me-2 text-facebook"></i>Facebook</a></li>
<li class="nav-item"><a class="nav-link" href="#"><i class="fab fa-twitter-square fa-fw me-2 text-twitter"></i>Twitter</a></li>
<li class="nav-item"><a class="nav-link" href="#"><i class="fab fa-linkedin fa-fw me-2 text-linkedin"></i>Linkedin</a></li>
<li class="nav-item"><a class="nav-link" href="#"><i class="fab fa-youtube-square fa-fw me-2 text-youtube"></i>YouTube</a></li>
</ul>
</div>
</div>
<!-- Widgets END -->
</div>
</footer>
<!-- =======================
Footer END -->
<!-- =======================
Cookies alert START -->
<div class="alert alert-light alert-dismissible fade show position-fixed bottom-0 start-50 translate-middle-x z-index-99 d-lg-flex justify-content-between align-items-center shadow p-4 col-9 col-md-5" role="alert">
<p class="m-0 pe-3">This website stores cookies on your computer. To find out more about the cookies we use, see our <a class="text-reset" href="#"> <u>Privacy Policy</u></a></p>
<div class="d-flex mt-3 mt-lg-0">
<button type="button" class="btn btn-success-soft btn-sm mb-0 me-2" 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>
<!-- =======================
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>
<!-- Template Functions -->
<script src="assets/js/functions.js"></script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink