504 lines
28 KiB
HTML
504 lines
28 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/it-business/it-business.css" />
|
|
</head>
|
|
<body data-mobile-nav-style="full-screen-menu" data-mobile-nav-bg-color="#252840">
|
|
|
|
<header>
|
|
|
|
<nav class="navbar navbar-expand-lg header-transparent bg-transparent header-reverse glass-effect" data-header-hover="light">
|
|
<div class="container-fluid">
|
|
<div class="col-auto col-xxl-3 col-lg-2 me-lg-0 me-auto">
|
|
<a class="navbar-brand" href="demo-it-business.html">
|
|
<img src="images/demo-it-business-logo-white.png" data-at2x="images/demo-it-business-logo-white@2x.png" alt class="default-logo">
|
|
<img src="images/demo-it-business-logo-black.png" data-at2x="images/demo-it-business-logo-black@2x.png" alt class="alt-logo">
|
|
<img src="images/demo-it-business-logo-black.png" data-at2x="images/demo-it-business-logo-black@2x.png" alt class="mobile-logo">
|
|
</a>
|
|
</div>
|
|
<div class="col-auto col-xxl-6 col-lg-8 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 justify-content-center" id="navbarNav">
|
|
<ul class="navbar-nav">
|
|
<li class="nav-item"><a href="demo-it-business.html" class="nav-link">Home</a></li>
|
|
<li class="nav-item"><a href="demo-it-business-about.html" class="nav-link">About</a></li>
|
|
<li class="nav-item dropdown dropdown-with-icon-style02">
|
|
<a href="demo-it-business-services.html" class="nav-link">Services</a>
|
|
<i class="fa-solid fa-angle-down dropdown-toggle" id="navbarDropdownMenuLink" role="button" data-bs-toggle="dropdown" aria-expanded="false"></i>
|
|
<ul class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
|
|
<li><a href="demo-it-business-services-details.html"><i class="bi bi-briefcase"></i>Data analytics</a></li>
|
|
<li><a href="demo-it-business-services-details.html"><i class="bi bi-clipboard-data"></i>Finance consulting</a></li>
|
|
<li><a href="demo-it-business-services-details.html"><i class="bi bi-peace"></i>Technology innovation</a></li>
|
|
<li><a href="demo-it-business-services-details.html"><i class="bi bi-bar-chart-line"></i>Digital commerce</a></li>
|
|
<li><a href="demo-it-business-services-details.html"><i class="bi bi-send-check"></i>Artificial intelligence</a></li>
|
|
<li><a href="demo-it-business-services-details.html"><i class="bi bi-globe2"></i>Cloud computing</a></li>
|
|
</ul>
|
|
</li>
|
|
<li class="nav-item"><a href="demo-it-business-case-studies.html" class="nav-link">Case studies</a></li>
|
|
<li class="nav-item"><a href="demo-it-business-blog.html" class="nav-link">Blog</a></li>
|
|
<li class="nav-item"><a href="demo-it-business-contact.html" class="nav-link">Contact</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto col-xxl-3 col-lg-2 text-end d-none d-sm-flex">
|
|
<div class="header-icon">
|
|
<div class="header-button"><a href="demo-it-business-contact.html" class="btn btn-large btn-transparent-white-light btn-rounded text-transform-none border-1">Start a project<i class="fa-solid fa-arrow-right"></i></a></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
</header>
|
|
|
|
|
|
<section class="full-screen ipad-top-space-margin sm-h-600px" data-parallax-background-ratio="0.5" style="background-image: url('images/demo-corporate-main-slider-02.jpg')">
|
|
<div class="opacity-light bg-dark-gray"></div>
|
|
<div class="container-fluid z-index-1 position-relative h-100">
|
|
<div class="row h-100 align-items-center">
|
|
<div class="col-xxl-9 col-xl-10 col-lg-11 d-flex flex-column justify-content-center">
|
|
<div class="ps-15 pe-15 md-ps-10 md-pe-10 sm-px-0" data-anime="{ "el": "childs", "translateX": [50, 0], "opacity": [0,1], "duration": 1200, "delay": 0, "staggervalue": 150, "easing": "easeOutQuad" }">
|
|
<span class="alt-font fs-20 text-white mb-3 d-inline-block fw-300">Posted by <a href="demo-it-business-blog.html" class="text-white text-white-hover fw-700 text-decoration-line-bottom">Shane smith</a></span>
|
|
<h1 class="alt-font text-white fw-600 mb-5 ls-minus-2px">Better to see something once than hear about it a thousand times.</h1>
|
|
<a href="demo-it-business-blog.html" class="btn btn-large btn-white btn-hover-animation-switch btn-box-shadow btn-rounded fw-600">Corporate</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
|
|
<section>
|
|
<div class="container">
|
|
<div class="row justify-content-center">
|
|
<div class="col-lg-8" data-anime="{ "el": "childs", "translateY": [50, 0], "opacity": [0,1], "duration": 1200, "delay": 0, "staggervalue": 150, "easing": "easeOutQuad" }">
|
|
<div class="dropcap-style-04">
|
|
<p><span class="alt-font first-letter first-letter-block border first-letter-round border-2 border-color-light-medium-gray text-dark-gray">N</span>lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore.</p>
|
|
</div>
|
|
<div class="text-center mt-6">
|
|
<h5 class="alt-font fw-600 text-dark-gray w-90 sm-w-100 mx-auto mb-15px">Architecture tends to consume everything else it has become one's entire life.</h5>
|
|
<span class="text-uppercase fs-15 ls-2px fw-600 alt-font">- Shoko mugikura -</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
|
|
<section class="one-fourth-screen border-radius-6px lg-border-radius-0px border border-color-transparent" data-parallax-background-ratio="0.5" style="background-image: url('images/demo-business-blog-single-creative-bg.jpg')"></section>
|
|
|
|
|
|
<section>
|
|
<div class="container">
|
|
<div class="row justify-content-center">
|
|
<div class="col-lg-8 last-paragraph-no-margin" data-anime="{ "el": "childs", "translateY": [50, 0], "opacity": [0,1], "duration": 1200, "delay": 0, "staggervalue": 150, "easing": "easeOutQuad" }">
|
|
<h5 class="alt-font fw-600 text-dark-gray">Tomorrow is the most important thing in life comes into us at midnight very clean</h5>
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent ullamcorper ex nunc, in fringilla orci fringilla sed. Nam semper odio eu urna viverra, eu luctus mauris sollicitudin. Morbi ultricies est et odio vehicula, vel lacinia ipsum ullamcorper. Mauris mattis placerat quam, aliquam vestibulum dui bibendum eu. Curabitur eu euismod ex, et hendrerit purus. Donec condimentum vel neque id iaculis. Etiam dui id dolor lobortis cursus ac maximus nisl. In sodales lacus nec cursus varius.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
|
|
<section class="py-0">
|
|
<div class="container">
|
|
<div class="row justify-content-center">
|
|
<div class="col-12" data-anime="{ "el": "childs", "translateY": [50, 0], "opacity": [0,1], "duration": 1200, "delay": 0, "staggervalue": 150, "easing": "easeOutQuad" }">
|
|
<img src="images/demo-business-blog-single-creative-01.jpg" class="w-100 mb-7 border-radius-5px" alt>
|
|
<img src="images/demo-business-blog-single-creative-02.jpg" class="w-100 border-radius-5px" alt>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
|
|
<section>
|
|
<div class="container">
|
|
<div class="row justify-content-center">
|
|
<div class="col-lg-8 last-paragraph-no-margin" data-anime="{ "el": "childs", "translateY": [50, 0], "opacity": [0,1], "duration": 1200, "delay": 0, "staggervalue": 150, "easing": "easeOutQuad" }">
|
|
<h5 class="alt-font fw-600 text-dark-gray mb-15px">Architecture is inhabited sculpture</h5>
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent ullamcorper ex nunc, in fringilla orci fringilla sed. Nam semper odio eu urna viverra, eu luctus mauris sollicitudin. Morbi ultricies est et odio vehicula, vel lacinia ipsum ullamcorper. Mauris mattis placerat quam, aliquam vestibulum dui bibendum eu. Curabitur eu euismod ex, et hendrerit purus. Donec condimentum vel neque id iaculis. Etiam dui id dolor lobortis cursus ac maximus nisl. In sodales lacus nec cursus varius.</p>
|
|
<h5 class="alt-font fw-600 text-dark-gray mb-15px mt-6">A room is not a room without natural light</h5>
|
|
<p>Morbi ultricies est et odio vehicula, vel lacinia ipsum ullamcorper. Mauris mattis placerat quam, aliquam vestibulum dui bibendum eu. Curabitur eu euismod ex, et hendrerit purus. Donec condimentum vel neque id iaculis. Etiam dui id dolor lobortis cursus ac maximus nisl. In sodales lacus nec cursus varius.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
|
|
<section class="half-section pt-0">
|
|
<div class="container">
|
|
<div class="row justify-content-center" data-anime="{ "el": "childs", "translateY": [0, 0], "opacity": [0,1], "duration": 1200, "delay": 0, "staggervalue": 150, "easing": "easeOutQuad" }">
|
|
<div class="col-lg-8">
|
|
<div class="row mb-30px">
|
|
<div class="tag-cloud col-md-9 text-center text-md-start sm-mb-15px">
|
|
<a href="demo-it-business-blog.html">Architecture</a>
|
|
<a href="demo-it-business-blog.html">Interior</a>
|
|
<a href="demo-it-business-blog.html">Landscape</a>
|
|
<a href="demo-it-business-blog.html">Residential</a>
|
|
</div>
|
|
<div class="tag-cloud col-md-3 text-uppercase text-center text-md-end">
|
|
<a class="likes-count fw-500 mx-0" href="demo-it-business-blog-single-clean.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 sm-mb-10">
|
|
<div class="bg-nero-grey 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-it-business-blog.html" class="text-dark-gray fw-500 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-it-business-blog.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="medium-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">
|
|
<div class="container">
|
|
<div class="row justify-content-center mb-1">
|
|
<div class="col-lg-7 text-center" data-anime="{ "el": "childs", "translateY": [50, 0], "opacity": [0,1], "duration": 600, "delay": 0, "staggervalue": 300, "easing": "easeOutQuad" }">
|
|
<span class="ps-25px pe-25px mb-20px text-uppercase text-base-color fs-12 lh-40 fw-700 border-radius-100px bg-gradient-light-gray-transparent d-inline-flex">You may also like</span>
|
|
<h4 class="text-dark-gray fw-700">Related posts</h4>
|
|
</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-0 border-radius-5px box-shadow-quadruple-large box-shadow-quadruple-large-hover">
|
|
<div class="blog-image">
|
|
<a href="demo-it-business-blog-single-clean.html" class="d-block"><img src="images/demo-corporate-blog-01.jpg" alt /></a>
|
|
<div class="blog-categories">
|
|
<a href="demo-it-business-blog.html" class="categories-btn bg-white text-dark-gray text-dark-gray-hover text-uppercase fw-700">Agency</a>
|
|
</div>
|
|
</div>
|
|
<div class="card-body p-12 lg-p-10">
|
|
<a href="demo-it-business-blog-single-clean.html" class="card-title mb-15px fw-700 fs-19 lh-30 text-dark-gray d-inline-block w-90 md-w-100">Build up healthy habits and strong peaceful life</a>
|
|
<p>Lorem ipsum dolor consectetur adipiscing eiusmod tempor</p>
|
|
<div class="author d-flex justify-content-center align-items-center position-relative overflow-hidden fs-14 text-uppercase">
|
|
<div class="me-auto">
|
|
<span class="blog-date d-inline-block fw-700 text-dark-gray">30 August 2021</span>
|
|
<div class="d-inline-block author-name fw-700 text-dark-gray">By <a href="demo-it-business-blog.html" class="text-dark-gray text-decoration-line-bottom">Den viliamson</a></div>
|
|
</div>
|
|
<div class="like-count">
|
|
<a href="demo-it-business-blog-single-clean.html#"><i class="fa-regular fa-heart text-red"></i><span class="text-dark-gray align-middle fw-700">25</span></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
|
|
|
|
<li class="grid-item">
|
|
<div class="card border-0 border-radius-5px box-shadow-quadruple-large box-shadow-quadruple-large-hover">
|
|
<div class="blog-image">
|
|
<a href="demo-it-business-blog-single-clean.html" class="d-block"><img src="images/demo-corporate-blog-02.jpg" alt /></a>
|
|
<div class="blog-categories">
|
|
<a href="demo-it-business-blog.html" class="categories-btn bg-white text-dark-gray text-dark-gray-hover text-uppercase fw-700">Luxurious</a>
|
|
</div>
|
|
</div>
|
|
<div class="card-body p-12 lg-p-10">
|
|
<a href="demo-it-business-blog-single-clean.html" class="card-title mb-15px fw-700 fs-19 lh-30 text-dark-gray d-inline-block w-90 md-w-100">How to bring the season into your great marketing</a>
|
|
<p>Lorem ipsum dolor consectetur adipiscing eiusmod tempor</p>
|
|
<div class="author d-flex justify-content-center align-items-center position-relative overflow-hidden fs-14 text-uppercase">
|
|
<div class="me-auto">
|
|
<span class="blog-date d-inline-block fw-700 text-dark-gray">28 August 2021</span>
|
|
<div class="d-inline-block author-name fw-700 text-dark-gray">By <a href="demo-it-business-blog.html" class="text-dark-gray text-decoration-line-bottom">Hugh macleod</a></div>
|
|
</div>
|
|
<div class="like-count">
|
|
<a href="demo-it-business-blog-single-clean.html#"><i class="fa-regular fa-heart text-red"></i><span class="text-dark-gray align-middle fw-700">58</span></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
|
|
|
|
<li class="grid-item">
|
|
<div class="card border-0 border-radius-5px box-shadow-quadruple-large box-shadow-quadruple-large-hover">
|
|
<div class="blog-image">
|
|
<a href="demo-it-business-blog-single-clean.html" class="d-block"><img src="images/demo-corporate-blog-03.jpg" alt /></a>
|
|
<div class="blog-categories">
|
|
<a href="demo-it-business-blog.html" class="categories-btn bg-white text-dark-gray text-dark-gray-hover text-uppercase fw-700">Business</a>
|
|
</div>
|
|
</div>
|
|
<div class="card-body p-12 lg-p-10">
|
|
<a href="demo-it-business-blog-single-clean.html" class="card-title mb-15px fw-700 fs-19 lh-30 text-dark-gray d-inline-block w-90 md-w-100">Be the strong willed one the public relationship</a>
|
|
<p>Lorem ipsum dolor consectetur adipiscing eiusmod tempor</p>
|
|
<div class="author d-flex justify-content-center align-items-center position-relative overflow-hidden fs-14 text-uppercase">
|
|
<div class="me-auto">
|
|
<span class="blog-date d-inline-block fw-700 text-dark-gray">26 August 2021</span>
|
|
<div class="d-inline-block author-name fw-700 text-dark-gray">By <a href="demo-it-business-blog.html" class="text-dark-gray text-decoration-line-bottom">Walton smith</a></div>
|
|
</div>
|
|
<div class="like-count">
|
|
<a href="demo-it-business-blog-single-clean.html#"><i class="fa-regular fa-heart text-red"></i><span class="text-dark-gray align-middle fw-700">75</span></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
|
|
<section>
|
|
<div class="container">
|
|
<div class="row justify-content-center mb-3" data-anime="{ "el": "childs", "translateY": [0, 0], "opacity": [0,1], "duration": 1200, "delay": 0, "staggervalue": 150, "easing": "easeOutQuad" }">
|
|
<div class="col-lg-9 text-center">
|
|
<h6 class="alt-font text-dark-gray fw-700">4 Comments</h6>
|
|
</div>
|
|
</div>
|
|
<div class="row justify-content-center">
|
|
<div class="col-lg-9">
|
|
<ul class="blog-comment" data-anime="{ "el": "childs", "translateY": [0, 0], "opacity": [0,1], "duration": 1200, "delay": 0, "staggervalue": 150, "easing": "easeOutQuad" }">
|
|
<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-it-business-blog-single-clean.html#" class="text-dark-gray fw-600">Herman Miller</a>
|
|
<a href="demo-it-business-blog-single-clean.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-it-business-blog-single-clean.html#" class="text-dark-gray fw-600">Wilbur Haddock</a>
|
|
<a href="demo-it-business-blog-single-clean.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-it-business-blog-single-clean.html#" class="text-dark-gray text-dark-gray-hover fw-600">Colene Landin</a>
|
|
<a href="demo-it-business-blog-single-clean.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-it-business-blog-single-clean.html#" class="text-dark-gray fw-600">Jennifer Freeman</a>
|
|
<a href="demo-it-business-blog-single-clean.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 position-relative">
|
|
<div class="container" data-anime="{ "el": "childs", "translateY": [0, 0], "opacity": [0,1], "duration": 1200, "delay": 0, "staggervalue": 150, "easing": "easeOutQuad" }">
|
|
<div class="row justify-content-center">
|
|
<div class="col-lg-9 mb-3 sm-mb-6">
|
|
<h6 class="alt-font text-dark-gray fw-700 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 border-color-charcoal-grey bg-transparent form-control required" type="text" name="name" placeholder="Enter your name*">
|
|
</div>
|
|
<div class="col-md-6 mb-30px">
|
|
<input class="border-radius-4px border-color-charcoal-grey bg-transparent 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 border-color-charcoal-grey bg-transparent 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-round-edge submit" type="submit">Post Comment</button>
|
|
<div class="form-results mt-20px d-none"></div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="shape-image-animation p-0 w-100 bottom-minus-40px xl-bottom-0px d-none d-md-block">
|
|
<svg xmlns="http://www.w3.org/2000/svg" widht="3000" height="400" viewBox="0 180 2500 200" fill="#ffffff">
|
|
<path class="st1" d="M 0 250 C 1200 400 1200 50 3000 250 L 3000 550 L 0 550 L 0 250">
|
|
<animate attributeName="d" dur="5s" values="M 0 250 C 1200 400 1200 50 3000 250 L 3000 550 L 0 550 L 0 250;
|
|
M 0 250 C 400 50 400 400 3000 250 L 3000 550 L 0 550 L 0 250;
|
|
M 0 250 C 1200 400 1200 50 3000 250 L 3000 550 L 0 550 L 0 250" repeatCount="indefinite" />
|
|
</path>
|
|
</svg>
|
|
</div>
|
|
</section>
|
|
|
|
|
|
<footer class="p-0 footer-light position-relative">
|
|
<div class="container position-relative">
|
|
<div class="row justify-content-center pt-5 sm-pt-40px">
|
|
|
|
<div class="col-6 col-xl-3 col-lg-12 col-sm-6 last-paragraph-no-margin text-xl-start text-lg-center order-sm-1 lg-mb-50px sm-mb-30px">
|
|
<a href="demo-it-business.html" class="footer-logo mb-15px d-inline-block">
|
|
<img src="images/demo-it-business-logo-black.png" data-at2x="images/demo-it-business-logo-black@2x.png" alt>
|
|
</a>
|
|
<p class="lh-28 w-90 xl-w-100 mx-lg-auto mx-xl-0">Gearing your company through an innovative strategy.</p>
|
|
<div class="elements-social social-icon-style-02 mt-15px">
|
|
<ul class="medium-icon dark">
|
|
<li class="my-0"><a class="facebook" href="https://www.facebook.com/" target="_blank"><i class="fa-brands fa-facebook-f"></i></a></li>
|
|
<li class="my-0"><a class="dribbble" href="http://www.dribbble.com" target="_blank"><i class="fa-brands fa-dribbble"></i></a></li>
|
|
<li class="my-0"><a class="twitter" href="https://www.twitter.com" target="_blank"><i class="fa-brands fa-twitter"></i></a></li>
|
|
<li class="my-0"><a class="instagram" href="https://www.instagram.com" target="_blank"><i class="fa-brands fa-instagram"></i></a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="col-6 col-xl-2 col-lg-3 col-sm-4 xs-mb-30px order-sm-3 order-lg-2">
|
|
<span class="fw-600 d-block text-dark-gray mb-5px">Company</span>
|
|
<ul>
|
|
<li><a href="demo-it-business-about.html">Who we are</a></li>
|
|
<li><a href="demo-it-business-services.html">Our services</a><div class="bg-dark-gray fw-600 text-white lh-22 text-uppercase border-radius-30px ps-10px pe-10px fs-10 ms-10px d-inline-block align-middle">Hot</div></li>
|
|
<li><a href="demo-it-business-case-studies.html">Our clients</a></li>
|
|
<li><a href="demo-it-business-contact.html">Contact us</a></li>
|
|
</ul>
|
|
</div>
|
|
|
|
|
|
<div class="col-6 col-xl-2 col-lg-3 col-md-5 col-sm-4 xs-mb-30px order-sm-4 order-lg-3">
|
|
<span class="fw-600 d-block text-dark-gray mb-5px">Services</span>
|
|
<ul>
|
|
<li><a href="demo-it-business-blog-single-clean.html#">Planning</a></li>
|
|
<li><a href="demo-it-business-blog-single-clean.html#">Research</a></li>
|
|
<li><a href="demo-it-business-blog-single-clean.html#">Consulting</a></li>
|
|
<li><a href="demo-it-business-blog-single-clean.html#">Analysis</a></li>
|
|
</ul>
|
|
</div>
|
|
|
|
|
|
<div class="col-6 col-xl-2 col-lg-3 col-md-3 col-sm-4 xs-mb-30px order-sm-5 order-lg-4">
|
|
<span class="fw-600 d-block text-dark-gray mb-5px">Need help?</span>
|
|
<span>Call us directly?</span>
|
|
<span class="d-block mb-10px"><a class="text-dark-gray fw-600" href="tel:1235678901">(123) 567 8901</a></span>
|
|
<span>Need support?</span>
|
|
<a href="cdn-cgi/l/email-protection.html#7018151c0030141f1d11191e5e131f1d" class="text-dark-gray fw-600"><span class="__cf_email__" data-cfemail="4b232e273b0b2f24262a222565282426">[email protected]</span></a>
|
|
</div>
|
|
|
|
|
|
<div class="col-xl-3 col-lg-3 col-sm-6 md-mb-50px sm-mb-30px xs-mb-0 order-sm-2 order-lg-5">
|
|
<span class="fw-600 d-block text-dark-gray mb-5px">Subscribe newsletter</span>
|
|
<p class="lh-28 w-95 mb-10px xs-mb-10px">Subscribe our newsletter to get the latest news and updates!</p>
|
|
<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="fs-15 bg-white 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 class="btn submit" aria-label="submit"><i class="icon feather icon-feather-mail icon-small"></i></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="row justify-content-center align-items-center pt-7">
|
|
|
|
<div class="col-12">
|
|
<div class="divider-style-03 divider-style-03-01 border-color-extra-medium-gray"></div>
|
|
</div>
|
|
|
|
|
|
<div class="col-lg-5 pt-20px pb-20px md-pt-0 order-2 order-lg-1 text-center text-lg-start last-paragraph-no-margin fs-14"><p>© 2024 Crafto is Proudly Powered by <a href="https://www.themezaa.com/" target="_blank" class="text-dark-gray fw-600 text-decoration-line-bottom">ThemeZaa</a></p></div>
|
|
|
|
|
|
<div class="col-lg-7 pt-20px pb-20px md-pt-25px md-pb-5px order-1 order-lg-2 text-center text-lg-end fs-14">
|
|
<ul class="footer-navbar sm-lh-normal">
|
|
<li><a href="demo-it-business-blog-single-clean.html#" class="nav-link">Privacy policy</a></li>
|
|
<li><a href="demo-it-business-blog-single-clean.html#" class="nav-link">Terms and conditions</a></li>
|
|
<li><a href="demo-it-business-blog-single-clean.html#" class="nav-link">Copyright</a></li>
|
|
</ul>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
|
|
<div class="scroll-progress d-none d-xxl-block">
|
|
<a href="demo-it-business-blog-single-clean.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> |