Access_New/pages/demo-blogger-blog-single-classic.html
2024-09-05 11:33:27 +05:45

535 lines
27 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html>
<html class="no-js" lang="en">
<head>
<title>Crafto - The Multipurpose HTML5 Template</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="author" content="ThemeZaa">
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<meta name="description" content="Elevate your online presence with Crafto - a modern, versatile, multipurpose Bootstrap 5 responsive HTML5, SCSS template using highly creative 52+ ready demos.">
<link rel="shortcut icon" href="images/favicon.png">
<link rel="apple-touch-icon" href="images/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
<link rel="preconnect" href="https://fonts.googleapis.com" crossorigin>
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="css/vendors.min.css" />
<link rel="stylesheet" href="css/icon.min.css" />
<link rel="stylesheet" href="css/style.min.css" />
<link rel="stylesheet" href="css/responsive.min.css" />
<link rel="stylesheet" href="demos/blogger/blogger.css" />
</head>
<body data-mobile-nav-style="classic">
<div class="box-layout">
<header class="header-with-topbar">
<div class="header-top-bar top-bar-dark bg-dark-gray disable-fixed">
<div class="container">
<div class="row g-0 h-50px align-items-center m-0">
<div class="col-md-7 text-center text-md-start">
<span class="widget fs-14 me-5px text-white d-none d-md-inline-block fw-500"><i class="fa-sharp fa-solid fa-heart text-base-color"></i>Trending:</span>
<a href="demo-blogger-blog-single-classic.html#" class="fs-14 text-medium-gray-hover">Top 10 night creams will help your skin to relax.</a>
</div>
<div class="col-5 text-end header-icon">
<div class="header-social-icon icon">
<a href="https://www.facebook.com" target="_blank"><i class="fa-brands fa-facebook-f"></i>26k</a>
<a href="https://www.twitter.com" target="_blank"><i class="fa-brands fa-twitter"></i>18k</a>
<a href="http://www.dribbble.com" target="_blank"><i class="fa-brands fa-dribbble"></i>06k</a>
</div>
</div>
</div>
</div>
</div>
<nav class="navbar navbar-expand-lg header-light bg-white disable-fixed" data-header-hover="dark">
<div class="container">
<div class="col-auto p-0">
<a class="navbar-brand" href="demo-blogger.html">
<img src="images/demo-blogger-logo-black.png" data-at2x="images/demo-blogger-logo-black@2x.png" alt class="default-logo">
<img src="images/demo-blogger-logo-black.png" data-at2x="images/demo-blogger-logo-black@2x.png" alt class="alt-logo">
<img src="images/demo-blogger-logo-black.png" data-at2x="images/demo-blogger-logo-black@2x.png" alt class="mobile-logo">
</a>
</div>
<div class="col-auto menu-order left-nav ps-40px md-ps-15px">
<button class="navbar-toggler float-start" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-label="Toggle navigation">
<span class="navbar-toggler-line"></span>
<span class="navbar-toggler-line"></span>
<span class="navbar-toggler-line"></span>
<span class="navbar-toggler-line"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item"><a href="demo-blogger.html" class="nav-link">Home</a></li>
<li class="nav-item"><a href="demo-blogger-fashion.html" class="nav-link">Fashion</a></li>
<li class="nav-item"><a href="demo-blogger-lifestyle.html" class="nav-link">Lifestyle</a></li>
<li class="nav-item"><a href="demo-blogger-style.html" class="nav-link">Style</a></li>
<li class="nav-item"><a href="demo-blogger-about.html" class="nav-link">About</a></li>
<li class="nav-item"><a href="demo-blogger-contact.html" class="nav-link">Contact</a></li>
</ul>
</div>
</div>
<div class="col-auto ms-auto pe-0">
<div class="header-icon">
<div class="header-search-icon icon d-none d-md-flex">
<a href="demo-blogger-blog-single-classic.html#" class="search-form-icon header-search-form fw-600"><i class="feather icon-feather-search text-base-color align-middle me-5px xl-me-0"></i><span class="align-middle d-none d-xxl-inline-block">Search</span></a>
<div class="search-form-wrapper">
<button title="Close" type="button" class="search-close">×</button>
<form id="search-form" role="search" method="get" class="search-form text-left" action="search-result.html">
<div class="search-form-box">
<h2 class="alt-font text-dark-gray text-center mb-4 fw-600 ls-minus-1px">What are you looking for?</h2>
<input class="search-input" id="search-form-input5e219ef164995" placeholder="Enter your keywords..." name="s" value type="text" autocomplete="off">
<button type="submit" class="search-button">
<i class="feather icon-feather-search" aria-hidden="true"></i>
</button>
</div>
</form>
</div>
</div>
<div class="header-button ms-20px xxl-ms-10px xs-ms-0 d-none d-md-block">
<a href="demo-blogger-blog-single-classic.html#footer" class="btn btn-small btn-base-color btn-slide-right btn-rounded left-icon section-link"><i class="feather icon-feather-mail"></i>Subscribe<span class="bg-white"></span></a>
</div>
</div>
</div>
</div>
</nav>
</header>
<section class="top-space-margin half-section py-0">
<div class="container-fluid p-0">
<div class="row">
<div class="col-12">
<img class="border-radius-6px w-100" src="images/demo-blogger-blog-single-classic-img-01.jpg" alt>
</div>
</div>
</div>
</section>
<section class="overlap-section text-center p-0 sm-pt-50px">
<img class="rounded-circle box-shadow-extra-large w-150px h-150px border border-9 border-color-white" src="images/avtar-07.jpg" alt>
</section>
<section class="pt-30px pb-0">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-10 text-center">
<span class="fs-18 mb-15px d-inline-block">Writer by <a href="demo-blogger-lifestyle.html" class="fw-600 d-inline-block align-middle text-dark-gray">Charlene carberry</a> in <a href="demo-blogger-lifestyle.html" class="d-inline-block align-middle text-dark-gray fw-600">Lifestyle</a></span>
<h2 class="alt-font fw-600 ls-minus-2px text-dark-gray mx-auto w-80 xl-w-100 mb-5">Style is a way to say who you are without having to speak</h2>
<i class="feather icon-feather-more-horizontal- icon-double-large text-light-gray d-inline-block mb-5 d-inline-block"></i>
</div>
</div>
</div>
</section>
<section class="py-0">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-10">
<div class="dropcap-style-02 last-paragraph-no-margin">
<p><span class="alt-font first-letter first-letter-block first-letter-round bg-dark-gray text-white">M</span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse fringilla, sapien luctus fermentum cursus, risus arcu tristique libero, eu ultricies mauris risus at mauris. Duis sit amet tempus massa, sit amet luctus erat. Quisque pulvinar ac nibh non sodales. Fusce facilisis est. Vestibulum venenatis, mauris ut accumsan lacinia ipsum nisl volutpat leo ut dictum mauris quam eget nibhmauris ut accumsan lacinia.</p>
<img src="images/blog-single-classic-03.jpg" class="mb-30px mt-6 border-radius-6px" alt>
<p class="pb-25px text-center text-dark-gray ls-1px fw-700 text-uppercase">We must never confuse elegance with snobbery</p>
<div class="h-3px w-100 bg-dark-gray"></div>
</div>
</div>
</div>
</div>
</section>
<section>
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-10">
<div class="row align-items-center">
<div class="col-xl-5 col-lg-6 md-mb-50px last-paragraph-no-margin">
<h4 class="alt-font text-dark-gray fw-600 ls-minus-1px">Diversity lasts when it no longer has to be the subject of a story.</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse fringilla, sapien luctus fermentum cursus, risus arcu tristique libero, eu ultricies mauris risus at mauris. Duis sit amet tempus massa, sit amet luctus erat. Vestibulum venenatis, mauris ut accumsan lacinia, ipsum nisl volutpat leo, ut dictum mauris quam eget nibh.</p>
<p>Suspendisse fringilla, sapien luctus fermentum cursus, risus arcu tristique libero, eu ultricies mauris. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse fringilla, sapien luctus.</p>
</div>
<div class="col-lg-6 offset-xl-1"><img src="images/blog-single-classic-04.jpg" class="border-radius-6px" alt></div>
</div>
</div>
</div>
</div>
</section>
<section class="pt-0">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-10">
<div class="row">
<div class="col-12 last-paragraph-no-margin">
<div class="h-3px w-100 bg-dark-gray"></div>
<p class="pt-25px text-center text-dark-gray ls-1px fw-700 text-uppercase">I want people to see the dress, but focus on the woman</p>
<img src="images/blog-single-classic-05.jpg" class="mb-8 mt-30px" alt>
</div>
<div class="col-md-6">
<h4 class="alt-font text-dark-gray fw-600 ls-minus-1px">Fashion is what you're offered four times a year by designers.</h4>
</div>
<div class="col-md-6 last-paragraph-no-margin">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse fringilla sapien luctus fermentum cursus, risus arcu tristique libero, eu ultricies mauris risus at mauris. Duis sit amet tempus massa. Vestibulum venenatis, mauris ut accumsan lacinia, ipsum nisl volutpat leo, ut dictum mauris quam eget nibh.</p>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="half-section pt-0">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-10">
<div class="row mb-30px">
<div class="tag-cloud col-12 col-md-9 text-center text-md-start sm-mb-15px">
<a href="demo-blogger-lifestyle.html">Development</a>
<a href="demo-blogger-lifestyle.html">Event</a>
<a href="demo-blogger-lifestyle.html">Multimedia </a>
<a href="demo-blogger-lifestyle.html">Fashion</a>
</div>
<div class="tag-cloud col-md-3 text-uppercase text-center text-md-end">
<a class="likes-count fw-700 mx-0" href="demo-blogger-blog-single-classic.html#"><i class="fa-regular fa-heart text-red me-10px"></i><span class="text-dark-gray text-dark-gray-hover">05 Likes</span></a>
</div>
</div>
<div class="row">
<div class="col-12 mb-6">
<div class="d-block d-md-flex w-100 box-shadow-extra-large align-items-center border-radius-4px p-7 sm-p-35px">
<div class="w-140px text-center me-50px sm-mx-auto">
<img src="images/avtar-07.jpg" class="rounded-circle w-120px" alt>
<a href="demo-blogger-lifestyle.html" class="text-dark-gray fw-600 mt-20px d-inline-block lh-20">Colene Landin</a>
<span class="fs-15 lh-20 d-block sm-mb-15px">Co-founder</span>
</div>
<div class="w-75 sm-w-100 text-center text-md-start last-paragraph-no-margin">
<p>Lorem ipsum is simply dummy text of the printing and typesetting industry. Lorem ipsum has been the industry's standard dummy text ever since the 1500s when an unknown printer took a galley of type.</p>
<a href="demo-blogger-lifestyle.html" class="btn btn-link btn-large text-dark-gray mt-15px">All author posts</a>
</div>
</div>
</div>
</div>
<div class="row justify-content-center">
<div class="col-12 text-center elements-social social-icon-style-04">
<ul class="large-icon dark">
<li><a class="facebook" href="https://www.facebook.com/" target="_blank"><i class="fa-brands fa-facebook-f"></i><span></span></a></li>
<li><a class="twitter" href="https://www.twitter.com" target="_blank"><i class="fa-brands fa-twitter"></i><span></span></a></li>
<li><a class="instagram" href="https://www.instagram.com" target="_blank"><i class="fa-brands fa-instagram"></i><span></span></a></li>
<li><a class="linkedin" href="http://www.linkedin.com" target="_blank"><i class="fa-brands fa-linkedin-in"></i><span></span></a></li>
<li><a class="behance" href="http://www.behance.com/" target="_blank"><i class="fa-brands fa-behance"></i><span></span></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="bg-very-light-gray border-radius-6px">
<div class="container">
<div class="row justify-content-center mb-1">
<div class="col-12 col-md-5 text-center">
<span class="ls-2px text-uppercase text-dark-gray fw-500 lh-22 mb-10px d-block">You may also <span class="d-inline-block border-2 border-bottom border-color-transparent-base-color fw-800">like</span></span>
<h3 class="fw-600 text-dark-gray alt-font ls-minus-1px w-90 mx-auto">Related posts</h3>
</div>
</div>
<div class="row">
<div class="col-12 px-0">
<ul class="blog-grid blog-wrapper grid grid-3col xl-grid-3col lg-grid-3col md-grid-2col sm-grid-2col xs-grid-1col gutter-double-extra-large">
<li class="grid-sizer"></li>
<li class="grid-item">
<div class="card border-radius-6px border-0 box-shadow-medium-bottom box-shadow-medium-bottom-hover">
<div class="blog-image">
<a href="demo-blogger-blog-single-classic.html" class="d-block"><img src="images/blog-images-56.jpg" alt /></a>
<div class="blog-categories">
<a href="demo-blogger-blog-single-classic.html#" class="categories-btn bg-dark-gray-transparent text-white text-uppercase fw-600">Fashion</a>
</div>
</div>
<div class="card-body p-11">
<a href="demo-blogger-blog-single-classic.html" class="card-title mb-15px fw-600 fs-18 lh-26 text-dark-gray d-inline-block">In difficult times, fashion is always outrageous.</a>
<p>Lorem ipsum dolor consectetur adipiscing elit finibus purus..</p>
<div class="author d-flex justify-content-center align-items-center position-relative overflow-hidden fs-15 text-uppercase">
<div class="me-auto">
<span class="text-dark-gray blog-date d-inline-block fw-600 text-transform-none">30 December 2023</span>
<div class="text-dark-gray d-inline-block author-name text-transform-none">By <a href="demo-blogger-blog-single-classic.html#" class="text-dark-gray text-decoration-line-bottom fw-600">Andy glamer</a></div>
</div>
<div class="like-count fs-14">
<a href="demo-blogger-blog-single-classic.html#"><i class="fa-regular fa-heart text-red d-inline-block"></i><span class="text-dark-gray align-middle fw-700">45</span></a>
</div>
</div>
</div>
</div>
</li>
<li class="grid-item">
<div class="card border-radius-6px border-0 box-shadow-medium-bottom box-shadow-medium-bottom-hover">
<div class="blog-image">
<a href="demo-blogger-blog-single-classic.html" class="d-block"><img src="images/blog-images-55.jpg" alt /></a>
<div class="blog-categories">
<a href="demo-blogger-blog-single-classic.html#" class="categories-btn bg-dark-gray-transparent text-white text-uppercase fw-600">Lifestyle</a>
</div>
</div>
<div class="card-body p-11">
<a href="demo-blogger-blog-single-classic.html" class="card-title mb-15px fw-600 fs-18 lh-26 text-dark-gray d-inline-block">We must never confuse elegance with snobbery.</a>
<p>Lorem ipsum dolor consectetur adipiscing elit finibus purus..</p>
<div class="author d-flex justify-content-center align-items-center position-relative overflow-hidden fs-15 text-uppercase">
<div class="me-auto">
<span class="text-dark-gray blog-date d-inline-block fw-600 text-transform-none">30 December 2023</span>
<div class="text-dark-gray d-inline-block author-name text-transform-none">By <a href="demo-blogger-blog-single-classic.html#" class="text-dark-gray text-decoration-line-bottom fw-600">Den viliamson</a></div>
</div>
<div class="like-count fs-14">
<a href="demo-blogger-blog-single-classic.html#"><i class="fa-regular fa-heart text-red d-inline-block"></i><span class="text-dark-gray align-middle fw-700">45</span></a>
</div>
</div>
</div>
</div>
</li>
<li class="grid-item">
<div class="card border-radius-6px border-0 box-shadow-medium-bottom box-shadow-medium-bottom-hover">
<div class="blog-image">
<a href="demo-blogger-blog-single-classic.html" class="d-block"><img src="images/blog-images-59.jpg" alt /></a>
<div class="blog-categories">
<a href="demo-blogger-blog-single-classic.html#" class="categories-btn bg-dark-gray-transparent text-white text-uppercase fw-600">Style</a>
</div>
</div>
<div class="card-body p-11">
<a href="demo-blogger-blog-single-classic.html" class="card-title mb-15px fw-600 fs-18 lh-26 text-dark-gray d-inline-block">Elegance is not standing out, but being remembered.</a>
<p>Lorem ipsum dolor consectetur adipiscing elit finibus purus..</p>
<div class="author d-flex justify-content-center align-items-center position-relative overflow-hidden fs-15 text-uppercase">
<div class="me-auto">
<span class="text-dark-gray blog-date d-inline-block fw-600 text-transform-none">28 December 2023</span>
<div class="text-dark-gray d-inline-block author-name text-transform-none">By <a href="demo-blogger-blog-single-classic.html#" class="text-dark-gray text-decoration-line-bottom fw-600">Jones robbert</a></div>
</div>
<div class="like-count fs-14">
<a href="demo-blogger-blog-single-classic.html#"><i class="fa-regular fa-heart text-red d-inline-block"></i><span class="text-dark-gray align-middle fw-700">45</span></a>
</div>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</section>
<section>
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-9 text-center mb-2">
<h6 class="alt-font text-dark-gray fw-500">4 Comments</h6>
</div>
</div>
<div class="row justify-content-center">
<div class="col-lg-9">
<ul class="blog-comment">
<li>
<div class="d-block d-md-flex w-100 align-items-center align-items-md-start ">
<div class="w-90px sm-w-65px sm-mb-10px">
<img src="images/avtar-18.jpg" class="rounded-circle" alt>
</div>
<div class="w-100 ps-30px last-paragraph-no-margin sm-ps-0">
<a href="demo-blogger-blog-single-classic.html#" class="text-dark-gray fw-600">Herman Miller</a>
<a href="demo-blogger-blog-single-classic.html#comments" class="btn-reply text-uppercase section-link">Reply</a>
<div class="fs-14 lh-24 mb-10px">17 July 2020, 6:05 PM</div>
<p class="w-85 sm-w-100">Lorem ipsum is simply dummy text of the printing and typesetting industry. Lorem ipsum has been the industry's standard dummy text ever since the make book.</p>
</div>
</div>
<ul class="child-comment">
<li>
<div class="d-block d-md-flex w-100 align-items-center align-items-md-start ">
<div class="w-90px sm-w-65px sm-mb-10px">
<img src="images/avtar-19.jpg" class="rounded-circle" alt>
</div>
<div class="w-100 ps-30px last-paragraph-no-margin sm-ps-0">
<a href="demo-blogger-blog-single-classic.html#" class="text-dark-gray fw-600">Wilbur Haddock</a>
<a href="demo-blogger-blog-single-classic.html#comments" class="btn-reply text-uppercase section-link">Reply</a>
<div class="fs-14 lh-24 mb-10px">18 July 2020, 10:19 PM</div>
<p class="w-85 sm-w-100">Lorem ipsum is simply dummy text of the printing and typesetting industry. Lorem ipsum has been the industry's standard dummy text ever since.</p>
</div>
</div>
</li>
<li>
<div class="d-block d-md-flex w-100 align-items-center align-items-md-start border-radius-5px p-50px md-p-30px sm-p-20px bg-very-light-gray">
<div class="w-90px sm-w-65px sm-mb-10px">
<img src="images/avtar-17.jpg" class="rounded-circle" alt>
</div>
<div class="w-100 ps-30px last-paragraph-no-margin sm-ps-0">
<a href="demo-blogger-blog-single-classic.html#" class="text-dark-gray fw-600">Colene Landin</a>
<a href="demo-blogger-blog-single-classic.html#comments" class="btn-reply text-uppercase section-link">Reply</a>
<div class="fs-14 lh-24 mb-10px">18 July 2020, 12:39 PM</div>
<p class="w-85 sm-w-100">Lorem ipsum is simply dummy text of the printing and typesetting industry. Ipsum has been the industry's standard dummy text.</p>
</div>
</div>
</li>
</ul>
</li>
<li>
<div class="d-block d-md-flex w-100 align-items-center align-items-md-start ">
<div class="w-90px sm-w-65px sm-mb-10px">
<img src="images/avtar-18.jpg" class="rounded-circle" alt>
</div>
<div class="w-100 ps-30px last-paragraph-no-margin sm-ps-0">
<a href="demo-blogger-blog-single-classic.html#" class="text-dark-gray fw-600">Jennifer Freeman</a>
<a href="demo-blogger-blog-single-classic.html#comments" class="btn-reply text-uppercase section-link">Reply</a>
<div class="fs-14 lh-24 mb-10px">19 July 2020, 8:25 PM</div>
<p class="w-85 sm-w-100">Lorem ipsum is simply dummy text of the printing and typesetting industry. Lorem ipsum has been the industry's standard dummy text ever since the make a type specimen book.</p>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</section>
<section id="comments" class="pt-0">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-9 mb-3 sm-mb-6">
<h6 class="alt-font text-dark-gray fw-500 mb-5px">Write a comment</h6>
<div class="mb-5px">Your email address will not be published. Required fields are marked *</div>
</div>
</div>
<div class="row justify-content-center">
<div class="col-lg-9">
<form action="email-templates/contact-form.php" method="post" class="row contact-form-style-02">
<div class="col-md-6 mb-30px">
<input class="input-name border-radius-4px form-control required" type="text" name="name" placeholder="Enter your name*">
</div>
<div class="col-md-6 mb-30px">
<input class="border-radius-4px form-control required" type="email" name="email" placeholder="Enter your email address*">
</div>
<div class="col-md-12 mb-30px">
<textarea class="border-radius-4px form-control" cols="40" rows="4" name="comment" placeholder="Your message"></textarea>
</div>
<div class="col-12">
<input type="hidden" name="redirect" value>
<button class="btn btn-dark-gray btn-small btn-box-shadow btn-round-edge submit" type="submit">Post comment</button>
<div class="form-results mt-20px d-none"></div>
</div>
</form>
</div>
</div>
</div>
</section>
<footer class="p-0 position-relative" id="footer">
<div class="bg-very-light-gray border-radius-6px pt-5 pb-5 md-pt-30px md-pb-30px md-ps-15px md-pe-15px sm-pt-50px sm-pb-50px">
<div class="container">
<div class="row">
<div class="col-md-6 col-lg-3 last-paragraph-no-margin order-md-1 md-mb-30px">
<a href="demo-blogger.html" class="footer-logo d-inline-block mb-10px"><img src="images/demo-blogger-footer-logo-black.png" data-at2x="images/demo-blogger-footer-logo-black@2x.png" alt></a>
<p class="lh-28 d-block w-80 mb-15px">401 Broadway, 24th Floor, Orchard View, London</p>
<div class="text-dark-gray fw-600"><i class="feather icon-feather-phone-call me-10px"></i>+1 234 567 8910</div>
<div class="text-dark-gray fw-600"><i class="feather icon-feather-mail me-10px"></i><a href="cdn-cgi/l/email-protection.html#1871767e77587c7775797176367b7775" class="text-dark-gray text-decoration-line-bottom"><span class="__cf_email__" data-cfemail="e881868e87a88c8785898186c68b8785">[email&#160;protected]</span></a></div>
</div>
<div class="col-md-4 col-lg-2 order-md-3 order-lg-2 sm-mb-30px">
<span class="fw-700 text-dark-gray d-block mb-5px fs-17">Category</span>
<ul>
<li><a href="demo-blogger-fashion.html">Fashion</a></li>
<li><a href="demo-blogger-lifestyle.html">Lifestyle</a></li>
<li><a href="demo-blogger-style.html">Style</a></li>
<li><a href="demo-blogger-blog-single-classic.html#">Lookbook</a></li>
<li><a href="demo-blogger-blog-single-classic.html#">Beauty</a></li>
</ul>
</div>
<div class="col-md-4 col-lg-2 order-md-4 order-lg-3 sm-mb-30px">
<span class="fw-700 text-dark-gray d-block mb-5px fs-17">Information</span>
<ul>
<li><a href="demo-blogger-about.html">About us</a></li>
<li><a href="demo-blogger-blog-single-classic.html#">Readers guide</a></li>
<li><a href="demo-blogger-contact.html">Contact us</a></li>
<li><a href="demo-blogger-blog-single-classic.html#">Terms of use</a></li>
<li><a href="demo-blogger-blog-single-classic.html#">Privacy policy</a></li>
</ul>
</div>
<div class="col-md-4 col-lg-2 order-md-5 order-lg-4 sm-mb-30px">
<span class="fw-700 text-dark-gray d-block mb-5px fs-17">Follow us</span>
<ul>
<li><a href="https://www.facebook.com/" target="_blank">Facebook</a></li>
<li><a href="https://www.instagram.com/" target="_blank">Instagram</a></li>
<li><a href="https://twitter.com/" target="_blank">Twitter</a></li>
<li><a href="https://pinterest.com/" target="_blank">Pinterest</a></li>
<li><a href="https://www.behance.net/" target="_blank">Behance</a></li>
</ul>
</div>
<div class="col-md-6 col-lg-3 order-md-2 order-lg-5 md-mb-30px sm-mb-0">
<h5 class="alt-font fw-600 mb-20px text-dark-gray">Subscribe our newsletter.</h5>
<div class="d-inline-block w-100 newsletter-style-02 position-relative mb-10px">
<form action="email-templates/subscribe-newsletter.php" method="post" class="position-relative w-100">
<input class="input-medium bg-transparent border-color-transparent-base-color w-100 form-control pe-50px ps-20px lg-ps-15px required" type="email" name="email" placeholder="Enter email address" />
<input type="hidden" name="redirect" value>
<button class="btn pe-20px submit" aria-label="submit"><i class="icon feather icon-feather-mail icon-small text-base-color"></i></button>
<div class="form-results border-radius-6px pt-5px pb-5px ps-15px pe-15px fs-14 w-100 text-center position-absolute d-none"></div>
</form>
</div>
<div class="d-flex align-items-center fs-14">
<div class="d-inline-block"><i class="line-icon-Handshake me-10px align-middle icon-very-medium"></i>Protecting your privacy</div>
</div>
</div>
</div>
</div>
</div>
<div class="container">
<div class="row align-items-center pt-25px pb-25px">
<div class="col-xl-8 col-lg-7 last-paragraph-no-margin md-mb-10px lg-mb-0 fs-14 text-center text-lg-start">
<p class="lg-w-70 md-w-100">This site is protected by reCAPTCHA and the Google <a href="demo-blogger-blog-single-classic.html#" class="text-decoration-line-bottom">privacy policy</a> and <a href="demo-blogger-blog-single-classic.html#" class="text-decoration-line-bottom">terms of service</a> apply.</p>
</div>
<div class="col-xl-4 col-lg-5 last-paragraph-no-margin fs-14 text-center text-lg-end">
<p>&copy; 2024 Crafto is Proudly Powered by <a href="http://www.themezaa.com/" target="_blank" class="text-decoration-line-bottom text-dark-gray fw-600">ThemeZaa</a></p>
</div>
</div>
</div>
</footer>
</div>
<div id="cookies-model" class="cookie-message bg-dark-gray border-radius-8px">
<div class="cookie-description fs-14 text-white mb-20px lh-22">We use cookies to enhance your browsing experience, serve personalized ads or content, and analyze our traffic. By clicking "Allow cookies" you consent to our use of cookies. </div>
<div class="cookie-btn">
<a href="demo-blogger-blog-single-classic.html#" class="btn btn-transparent-white border-1 border-color-transparent-white-light btn-very-small btn-switch-text btn-rounded w-100 mb-15px" aria-label="btn">
<span>
<span class="btn-double-text" data-text="Cookie policy">Cookie policy</span>
</span>
</a>
<a href="demo-blogger-blog-single-classic.html#" class="btn btn-white btn-very-small btn-switch-text btn-box-shadow accept_cookies_btn btn-rounded w-100" data-accept-btn aria-label="text">
<span>
<span class="btn-double-text" data-text="Allow cookies">Allow cookies</span>
</span>
</a>
</div>
</div>
<div class="scroll-progress d-none d-xxl-block">
<a href="demo-blogger-blog-single-classic.html#" class="scroll-top" aria-label="scroll">
<span class="scroll-text">Scroll</span><span class="scroll-line"><span class="scroll-point"></span></span>
</a>
</div>
<script data-cfasync="false" src="cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script><script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/vendors.min.js"></script>
<script type="text/javascript" src="js/main.js"></script>
</body>
</html>