496 lines
25 KiB
HTML
496 lines
25 KiB
HTML
|
<!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/magazine/magazine.css" />
|
|||
|
|
</head>
|
|||
|
|
<body data-mobile-nav-style="classic">
|
|||
|
|
<div class="box-layout">
|
|||
|
|
|
|||
|
|
<header>
|
|||
|
|
|
|||
|
|
<nav class="navbar navbar-expand-lg bg-white header-light disable-fixed">
|
|||
|
|
<div class="container-fluid">
|
|||
|
|
<div class="col-auto col-xxl-3 col-lg-2 me-lg-0 me-auto">
|
|||
|
|
<div class="header-icon">
|
|||
|
|
<div class="header-push-button icon">
|
|||
|
|
<div class="push-button">
|
|||
|
|
<span></span>
|
|||
|
|
<span></span>
|
|||
|
|
<span></span>
|
|||
|
|
<span></span>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<a class="navbar-brand" href="demo-magazine.html">
|
|||
|
|
<img src="images/demo-magazine-logo-black.png" data-at2x="images/demo-magazine-logo-black@2x.png" alt class="default-logo">
|
|||
|
|
<img src="images/demo-magazine-logo-black.png" data-at2x="images/demo-magazine-logo-black@2x.png" alt class="alt-logo">
|
|||
|
|
<img src="images/demo-magazine-logo-black.png" data-at2x="images/demo-magazine-logo-black@2x.png" alt class="mobile-logo">
|
|||
|
|
</a>
|
|||
|
|
</div>
|
|||
|
|
<div class="col-auto menu-order position-static">
|
|||
|
|
<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-magazine.html" class="nav-link">Home</a></li>
|
|||
|
|
<li class="nav-item"><a href="demo-magazine-fashion.html" class="nav-link">Fashion</a></li>
|
|||
|
|
<li class="nav-item"><a href="demo-magazine-food.html" class="nav-link">Food</a></li>
|
|||
|
|
<li class="nav-item"><a href="demo-magazine-travel.html" class="nav-link">Travel</a></li>
|
|||
|
|
<li class="nav-item"><a href="demo-magazine-music.html" class="nav-link">Music</a></li>
|
|||
|
|
<li class="nav-item"><a href="demo-magazine-fitness.html" class="nav-link">Fitness</a></li>
|
|||
|
|
<li class="nav-item"><a href="demo-magazine-contact.html" class="nav-link">Contact</a></li>
|
|||
|
|
</ul>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="col-auto col-xxl-3 col-xl-2 text-end md-pe-0">
|
|||
|
|
<div class="header-icon">
|
|||
|
|
<div class="header-search-icon icon d-none d-md-flex">
|
|||
|
|
<a href="demo-magazine-blog-single-creative.html#" class="search-form-icon header-search-form fw-800 text-uppercase"><i class="feather icon-feather-search text-dark-gray align-middle me-5px xl-me-0"></i><span class="fs-15 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="text-dark-gray text-center mb-4 fw-700 ls-minus-2px">What are you looking for?</h2>
|
|||
|
|
<input class="search-input border-color-dark-gray" 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-30px xxl-ms-10px xs-ms-0 d-none d-md-block">
|
|||
|
|
<a href="demo-magazine-blog-single-creative.html#subscribe" class="btn btn-dark-gray section-link btn-very-small left-icon btn-round-edge btn-box-shadow fw-600">
|
|||
|
|
<i class="feather icon-feather-mail align-middle"></i>Subscribe
|
|||
|
|
</a>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</nav>
|
|||
|
|
|
|||
|
|
|
|||
|
|
<div class="push-menu push-menu-style-2 ps-50px pe-50px pt-4 pb-4 bg-white">
|
|||
|
|
<span class="close-menu text-dark-gray text-dark-gray-hover"><i class="fa-solid fa-xmark fs-20"></i></span>
|
|||
|
|
<div class="d-flex flex-column align-items-center justify-content-center h-100">
|
|||
|
|
<div class="hamburger-menu menu-list-wrapper w-90 lg-w-100 lg-no-margin" data-scroll-options="{ "theme": "light" }">
|
|||
|
|
<ul class="text-dark-gray menu-item-list alt-font fw-700 ls-minus-1px">
|
|||
|
|
<li class="nav-item"><a href="demo-magazine.html" class="nav-link">Home</a></li>
|
|||
|
|
<li class="nav-item"><a href="demo-magazine-fashion.html" class="nav-link">Fashion</a></li>
|
|||
|
|
<li class="nav-item"><a href="demo-magazine-food.html" class="nav-link">Food</a></li>
|
|||
|
|
<li class="nav-item"><a href="demo-magazine-travel.html" class="nav-link">Travel</a></li>
|
|||
|
|
<li class="nav-item"><a href="demo-magazine-music.html" class="nav-link">Music</a></li>
|
|||
|
|
<li class="nav-item"><a href="demo-magazine-fitness.html" class="nav-link">Fitness</a></li>
|
|||
|
|
<li class="nav-item"><a href="demo-magazine-contact.html" class="nav-link">Contact</a></li>
|
|||
|
|
</ul>
|
|||
|
|
</div>
|
|||
|
|
<div class="text-center elements-social social-icon-style-04">
|
|||
|
|
<ul class="medium-icon dark">
|
|||
|
|
<li class="mx-0"><a class="facebook" href="https://www.facebook.com/" target="_blank"><i class="fa-brands fa-facebook-f"></i><span></span></a></li>
|
|||
|
|
<li class="mx-0"><a class="instagram" href="https://www.instagram.com" target="_blank"><i class="fa-brands fa-instagram"></i><span></span></a></li>
|
|||
|
|
<li class="mx-0"><a class="twitter" href="https://www.twitter.com" target="_blank"><i class="fa-brands fa-twitter"></i><span></span></a></li>
|
|||
|
|
<li class="mx-0"><a class="dribbble" href="http://www.dribbble.com" target="_blank"><i class="fa-brands fa-dribbble"></i><span></span></a></li>
|
|||
|
|
</ul>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
</header>
|
|||
|
|
|
|||
|
|
|
|||
|
|
<section class="top-space-margin">
|
|||
|
|
<div class="container">
|
|||
|
|
<div class="row justify-content-center">
|
|||
|
|
<div class="col-lg-10 text-center">
|
|||
|
|
<span class="fs-18 mb-3 d-inline-block">By <a href="demo-magazine-blog-single-creative.html#" class="text-dark-gray fw-500 text-decoration-line-bottom">Jackson</a> in <a href="demo-magazine-blog-single-creative.html#" class="text-dark-gray fw-500 text-decoration-line-bottom">Marketing</a> on 26 November 2021</span>
|
|||
|
|
<h1 class="alt-font fw-700 text-dark-gray ls-minus-2px mb-0">Marketing tips and tricks for your creative website</h1>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</section>
|
|||
|
|
|
|||
|
|
|
|||
|
|
<section class="py-0 ps-13 pe-13 lg-ps-4 lg-pe-4 sm-px-0">
|
|||
|
|
<div class="container-fluid">
|
|||
|
|
<div class="row justify-content-center">
|
|||
|
|
<div class="col-12"><img src="images/blog-single-creative-01.jpg" class="w-100" alt></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</section>
|
|||
|
|
|
|||
|
|
|
|||
|
|
<section>
|
|||
|
|
<div class="container">
|
|||
|
|
<div class="row justify-content-center">
|
|||
|
|
<div class="col-lg-10">
|
|||
|
|
<div class="row">
|
|||
|
|
<div class="col-lg-3 col-md-4 text-center sm-mb-30px">
|
|||
|
|
<div class="pb-20px">
|
|||
|
|
<img src="images/blog-single-creative-avtar.jpg" class="rounded-circle w-130px mb-20px" alt>
|
|||
|
|
<span class="d-block lh-26">Words by</span>
|
|||
|
|
<a href="blog-grid.html" class="text-dark-gray alt-font fw-700 text-uppercase">Jackson smith</a>
|
|||
|
|
</div>
|
|||
|
|
<div class="h-3px w-100 bg-base-color mb-20px"></div>
|
|||
|
|
<ul class="d-flex list-unstyled justify-content-center">
|
|||
|
|
<li class="me-25px"><a href="demo-magazine-blog-single-creative.html#" class="text-uppercase alt-font fs-13"><i class="feather icon-feather-message-circle me-5px icon-small align-middle"></i>Comment</a></li>
|
|||
|
|
<li><a href="demo-magazine-blog-single-creative.html#" class="text-uppercase alt-font fs-13"><i class="feather icon-feather-heart me-5px icon-small align-middle"></i>Like</a></li>
|
|||
|
|
</ul>
|
|||
|
|
</div>
|
|||
|
|
<div class="offset-lg-1 col-md-8 last-paragraph-no-margin text-center text-md-start">
|
|||
|
|
<h3 class="alt-font fw-700 text-dark-gray">Make performance analysis an ongoing strategy.</h3>
|
|||
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
|
|||
|
|
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo <span class="text-dark-gray text-decoration-line-bottom">inventore veritatis et quasi</span> architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia.</p>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</section>
|
|||
|
|
|
|||
|
|
|
|||
|
|
<section class="py-0 ps-13 pe-13 lg-ps-4 lg-pe-4 sm-px-0">
|
|||
|
|
<div class="container-fluid">
|
|||
|
|
<div class="row justify-content-center">
|
|||
|
|
<div class="col-12"><img src="images/blog-single-creative-02.jpg" class="w-100" alt></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</section>
|
|||
|
|
|
|||
|
|
|
|||
|
|
<section>
|
|||
|
|
<div class="container">
|
|||
|
|
<div class="row justify-content-center">
|
|||
|
|
<div class="col-lg-10">
|
|||
|
|
<div class="row">
|
|||
|
|
<div class="col-lg-3 col-md-4 text-center text-lg-end sm-mb-30px"><img src="images/demo-magazine-blog-single-creative-01.png" class="mt-10px" alt></div>
|
|||
|
|
<div class="offset-lg-1 col-md-8 last-paragraph-no-margin text-center text-md-start">
|
|||
|
|
<div class="pb-35px text-center text-md-start">
|
|||
|
|
<h5 class="text-dark-gray fw-700 w-90 md-w-100 alt-font">The artist's world is limitless. It can be found any where far from where he lives or a few feet away.</h5>
|
|||
|
|
<span class="fw-600 text-dark-gray d-block lh-20 text-uppercase ls-minus-05px">Nicholas Robinson</span>
|
|||
|
|
<span class="d-block text-uppercase fs-13">Founder of photos</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="h-3px w-100 bg-dark-gray mb-35px"></div>
|
|||
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
|
|||
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.</p>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</section>
|
|||
|
|
|
|||
|
|
|
|||
|
|
<section class="py-0 ps-13 pe-13 lg-ps-4 lg-pe-4 sm-px-0">
|
|||
|
|
<div class="container-fluid">
|
|||
|
|
<div class="row justify-content-center">
|
|||
|
|
<div class="col-12"><img src="images/blog-single-creative-07.jpg" class="w-100" alt></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</section>
|
|||
|
|
|
|||
|
|
|
|||
|
|
<section>
|
|||
|
|
<div class="container">
|
|||
|
|
<div class="row justify-content-center">
|
|||
|
|
<div class="col-lg-10">
|
|||
|
|
<div class="row">
|
|||
|
|
<div class="col-lg-3 col-md-4 text-center text-md-start"><h5 class="alt-font fw-700 text-dark-gray">Look for opportunities to diversify.</h5></div>
|
|||
|
|
<div class="offset-lg-1 col-md-8 last-paragraph-no-margin text-center text-md-start">
|
|||
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
|
|||
|
|
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, <span class="text-dark-gray text-decoration-line-bottom">totam rem aperiam</span> eaque ipsa quae ab illo inventore veritatis.</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="blog-grid.html">Development</a>
|
|||
|
|
<a href="blog-grid.html">Event</a>
|
|||
|
|
<a href="blog-grid.html">Multimedia </a>
|
|||
|
|
<a href="blog-grid.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-magazine-blog-single-creative.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="blog-grid.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="blog-grid.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-8 col-xl-5 text-center">
|
|||
|
|
<span class="text-uppercase text-dark-gray fw-600 lh-22 mb-10px d-block">You may also like</span>
|
|||
|
|
<h2 class="alt-font text-dark-gray fw-700 ls-minus-1px ps-35px pe-35px sm-ps-15px sm-pe-15px d-inline-block position-relative text-highlight shadow-none" data-shadow-animation="true" data-animation-delay="700"><span class="h-2px position-absolute left-0px top-55 bg-base-color separator-animation"></span>Related posts</h2>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="row">
|
|||
|
|
<div class="col-12 px-0">
|
|||
|
|
<ul class="blog-side-image blog-wrapper grid grid-2col xs-grid-1col gutter-double-extra-large">
|
|||
|
|
<li class="grid-sizer"></li>
|
|||
|
|
|
|||
|
|
<li class="grid-item">
|
|||
|
|
<div class="blog-box d-lg-flex d-block flex-row h-100 overflow-hidden box-shadow-double-large">
|
|||
|
|
<div class="blog-image w-45 md-w-100 cover-background" style="background-image: url('images/demo-magazine-home-12.jpg')">
|
|||
|
|
<a href="demo-magazine-blog-single-creative.html" class="blog-post-image-overlay"></a>
|
|||
|
|
</div>
|
|||
|
|
<div class="blog-content w-55 md-w-100 p-50px bg-white d-flex flex-column justify-content-center align-items-start lg-p-30px last-paragraph-no-margin">
|
|||
|
|
<a href="demo-magazine-travel.html" class="categories-btn bg-base-color text-white btn-box-shadow text-uppercase fw-600 mb-20px">Travel</a>
|
|||
|
|
<a href="demo-magazine-blog-single-creative.html" class="card-title text-dark-gray mb-15px fw-600 fs-22 alt-font w-95">Trendy is the last stage before tacky</a>
|
|||
|
|
<p>Lorem ipsum adipiscing purus fermentum. Praesent vitae quam sed...</p>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</li>
|
|||
|
|
|
|||
|
|
|
|||
|
|
<li class="grid-item">
|
|||
|
|
<div class="blog-box d-lg-flex d-block flex-row h-100 overflow-hidden box-shadow-double-large">
|
|||
|
|
<div class="blog-image w-45 md-w-100 cover-background" style="background-image: url('images/demo-magazine-home-11.jpg')">
|
|||
|
|
<a href="demo-magazine-blog-single-creative.html" class="blog-post-image-overlay"></a>
|
|||
|
|
</div>
|
|||
|
|
<div class="blog-content w-55 md-w-100 p-50px bg-white d-flex flex-column justify-content-center align-items-start lg-p-30px last-paragraph-no-margin">
|
|||
|
|
<a href="demo-magazine-music.html" class="categories-btn bg-base-color text-white btn-box-shadow text-uppercase fw-600 mb-20px">Lifestyle</a>
|
|||
|
|
<a href="demo-magazine-blog-single-creative.html" class="card-title text-dark-gray mb-15px fw-600 fs-22 alt-font w-95">Believe you can and you're halfway</a>
|
|||
|
|
<p>Lorem ipsum adipiscing purus fermentum. Praesent vitae quam sed...</p>
|
|||
|
|
</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-600">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-magazine-blog-single-creative.html#" class="text-dark-gray fw-600">Herman Miller</a>
|
|||
|
|
<a href="demo-magazine-blog-single-creative.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-magazine-blog-single-creative.html#" class="text-dark-gray fw-600">Wilbur Haddock</a>
|
|||
|
|
<a href="demo-magazine-blog-single-creative.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-magazine-blog-single-creative.html#" class="text-dark-gray fw-600">Colene Landin</a>
|
|||
|
|
<a href="demo-magazine-blog-single-creative.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-magazine-blog-single-creative.html#" class="text-dark-gray fw-600">Jennifer Freeman</a>
|
|||
|
|
<a href="demo-magazine-blog-single-creative.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 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-600 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 id="subscribe" class="bg-very-light-gray">
|
|||
|
|
<div class="container position-relative">
|
|||
|
|
<div class="position-absolute left-0px top-minus-150px md-top-minus-110px background-no-repeat h-300px w-100 d-none d-md-inline-block" style="background-image: url('images/demo-magazine-footer-icon.png')" data-bottom-top="transform: translateY(-50px)" data-top-bottom="transform: translateY(50px)"></div>
|
|||
|
|
<div class="row justify-content-center">
|
|||
|
|
<div class="col-12 col-xxl-6 col-xl-7 col-lg-8 text-center mb-50px sm-mb-30px">
|
|||
|
|
<h2 class="alt-font fw-800 ls-minus-1px text-dark-gray">Stay tuned with weekly newsletters.</h2>
|
|||
|
|
<div class="d-inline-block w-100 newsletter-style-04 position-relative">
|
|||
|
|
<form action="email-templates/subscribe-newsletter.php" method="post" class="position-relative w-100">
|
|||
|
|
<input class="bg-transparent w-100 border-0 border-bottom border-1 border-color-dark-gray form-control required" type="email" name="email" placeholder="Enter your email address" />
|
|||
|
|
<input type="hidden" name="redirect" value>
|
|||
|
|
<button type="submit" class="btn text-dark-gray fw-600 submit text-transform-none" aria-label="subscribe">Subscribe</button>
|
|||
|
|
<div class="form-results border-radius-0px p-15px fs-16 lh-24 w-100 text-center position-absolute d-none"></div>
|
|||
|
|
</form>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="footer-bottom">
|
|||
|
|
<div class="row justify-content-center">
|
|||
|
|
<div class="col-12 last-paragraph-no-margin text-center mb-50px sm-mb-30px">
|
|||
|
|
<p class="fs-15 text-dark-gray">© 2024 Crafto is Proudly Powered by <a href="https://www.themezaa.com/" target="_blank" class="text-dark-gray">ThemeZaa.</a></p>
|
|||
|
|
<a href="cdn-cgi/l/email-protection.html#2b42454d446b4f44464a424505484446" class="fs-18 text-dark-gray text-dark-gray-hover fw-600 text-decoration-line-bottom"><span class="__cf_email__" data-cfemail="51383f373e11353e3c30383f7f323e3c">[email protected]</span></a>
|
|||
|
|
</div>
|
|||
|
|
<div class="col-12 text-center">
|
|||
|
|
<div class="elements-social social-icon-style-02">
|
|||
|
|
<ul class="large-icon dark">
|
|||
|
|
<li><a class="facebook" href="https://www.facebook.com/" target="_blank"><i class="fa-brands fa-facebook-f"></i></a></li>
|
|||
|
|
<li><a class="dribbble" href="http://www.dribbble.com" target="_blank"><i class="fa-brands fa-dribbble"></i></a></li>
|
|||
|
|
<li><a class="twitter" href="https://www.twitter.com" target="_blank"><i class="fa-brands fa-twitter"></i></a></li>
|
|||
|
|
<li><a class="instagram" href="https://www.instagram.com" target="_blank"><i class="fa-brands fa-instagram"></i></a></li>
|
|||
|
|
</ul>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</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-magazine-blog-single-creative.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-magazine-blog-single-creative.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-magazine-blog-single-creative.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>
|