You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
613 lines
26 KiB
613 lines
26 KiB
4 months ago
|
<!DOCTYPE html>
|
||
|
<html>
|
||
|
<head>
|
||
|
<meta charset="utf-8" />
|
||
|
<title>Bizzpro - Digital Corporate Business Creative Html Template</title>
|
||
|
<!-- Stylesheets -->
|
||
|
<link href="css/bootstrap.css" rel="stylesheet" />
|
||
|
<link href="css/style.css" rel="stylesheet" />
|
||
|
<link href="css/scrollbar.css" rel="stylesheet" />
|
||
|
<!-- Responsive -->
|
||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||
|
<meta
|
||
|
name="viewport"
|
||
|
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
|
||
|
/>
|
||
|
<!--[if lt IE 9
|
||
|
]><script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script
|
||
|
><![endif]-->
|
||
|
<!--[if lt IE 9]><script src="js/respond.js"></script><![endif]-->
|
||
|
</head>
|
||
|
|
||
|
<body>
|
||
|
<!--Page Wrapper-->
|
||
|
<div class="page-wrapper">
|
||
|
<!--Sidebar-->
|
||
|
<aside id="sidebar">
|
||
|
<!--Toggle Button-->
|
||
|
<div class="button-container clearfix">
|
||
|
<div class="menu-toggle flaticon-menu10"></div>
|
||
|
</div>
|
||
|
|
||
|
<!--Menu Box-->
|
||
|
<div class="menu-box">
|
||
|
<!--Logo-->
|
||
|
<br />
|
||
|
<div class="logo text-center">
|
||
|
<a href="#"><img src="logo.png" alt="img"></a>
|
||
|
</div>
|
||
|
|
||
|
<!--Sticky Menu-->
|
||
|
<nav class="sticky-menu">
|
||
|
<ul>
|
||
|
<li class="current">
|
||
|
<a href="#introduction"
|
||
|
><span class="fa fa-arrow-right"></span
|
||
|
>Introduction </a>
|
||
|
</li>
|
||
|
<li>
|
||
|
<a href="#html-structure"
|
||
|
>HTML Structure <span class="fa fa-arrow-right"></span
|
||
|
></a>
|
||
|
</li>
|
||
|
<li>
|
||
|
<a href="#css-structure"
|
||
|
>CSS Files and Structure <span class="fa fa-arrow-right"></span
|
||
|
></a>
|
||
|
</li>
|
||
|
<li>
|
||
|
<a href="#javascript"
|
||
|
>Javascript <span class="fa fa-arrow-right"></span
|
||
|
></a>
|
||
|
</li>
|
||
|
<li>
|
||
|
<a href="#contact-form"
|
||
|
>Contact Form Settings<span class="fa fa-arrow-right"></span
|
||
|
></a>
|
||
|
</li>
|
||
|
<li>
|
||
|
<a href="#required-file"
|
||
|
>Required File<span class="fa fa-arrow-right"></span
|
||
|
></a>
|
||
|
</li>
|
||
|
<li>
|
||
|
<a href="#logo-area"
|
||
|
>Logo<span class="fa fa-arrow-right"></span
|
||
|
></a>
|
||
|
</li>
|
||
|
<li>
|
||
|
<a href="#about-area"
|
||
|
>About area<span class="fa fa-arrow-right"></span
|
||
|
></a>
|
||
|
</li>
|
||
|
<li>
|
||
|
<a href="#service-area"
|
||
|
>Fact Area<span class="fa fa-arrow-right"></span
|
||
|
></a>
|
||
|
</li>
|
||
|
<li>
|
||
|
<a href="#video-area"
|
||
|
>Video Area<span class="fa fa-arrow-right"></span
|
||
|
></a>
|
||
|
</li>
|
||
|
<li>
|
||
|
<a href="#faq-area"
|
||
|
>Featured Area<span class="fa fa-arrow-right"></span
|
||
|
></a>
|
||
|
</li>
|
||
|
<li>
|
||
|
<a href="#testimonial-area"
|
||
|
>testimonial Area<span class="fa fa-arrow-right"></span
|
||
|
></a>
|
||
|
</li>
|
||
|
<li>
|
||
|
<a href="#team-area"
|
||
|
>CTA Area<span class="fa fa-arrow-right"></span
|
||
|
></a>
|
||
|
</li>
|
||
|
<li>
|
||
|
<a href="#service-area"
|
||
|
>Service Area<span class="fa fa-arrow-right"></span
|
||
|
></a>
|
||
|
</li>
|
||
|
<li>
|
||
|
<a href="#blog-area"
|
||
|
>blog Area<span class="fa fa-arrow-right"></span
|
||
|
></a>
|
||
|
</li>
|
||
|
<li>
|
||
|
<a href="#footer-area"
|
||
|
>Footer Menu<span class="fa fa-arrow-right"></span
|
||
|
></a>
|
||
|
</li>
|
||
|
<li>
|
||
|
<a href="#copyright-area"
|
||
|
>Copy Right<span class="fa fa-arrow-right"></span
|
||
|
></a>
|
||
|
</li>
|
||
|
<li>
|
||
|
<a href="#Feature-card"
|
||
|
>Features <span class="fa fa-arrow-right"></span
|
||
|
></a>
|
||
|
</li>
|
||
|
<li>
|
||
|
<a href="#sources-credits"
|
||
|
>Sources and Credits <span class="fa fa-arrow-right"></span
|
||
|
></a>
|
||
|
</li>
|
||
|
<li>
|
||
|
<a href="#support"
|
||
|
>Support <span class="fa fa-arrow-right"></span
|
||
|
></a>
|
||
|
</li>
|
||
|
</ul>
|
||
|
</nav>
|
||
|
</div>
|
||
|
|
||
|
<div class="copyright">Copyright © <a href="#">Bizzpro</a> 2024</div>
|
||
|
</aside>
|
||
|
|
||
|
<div id="content-section">
|
||
|
<!--Introduction Section-->
|
||
|
<section class="section introduction" id="introduction">
|
||
|
<div class="sec-title">
|
||
|
<h2>Intoduction</h2>
|
||
|
</div>
|
||
|
|
||
|
<br />
|
||
|
<div class="sec-content">
|
||
|
<h2>Bizzpro</h2>
|
||
|
<h3>Bizzpro - Digital Corporate Business Creative Html Template</h3>
|
||
|
|
||
|
<div class="separator"></div>
|
||
|
|
||
|
<strong>Created :</strong> 1/1/2024 <br/>
|
||
|
<strong>Last Update :</strong> 1/1/2024 <br/>
|
||
|
<strong>By :</strong> wowtheme7<br />
|
||
|
|
||
|
<br />
|
||
|
<p>
|
||
|
Thank you for purchasing <strong>Bizzpro</strong> Digital Corporate Business Creative Html Template
|
||
|
If you have any questions that are beyond the scope of
|
||
|
this help file, please feel free to email, via my user page contact form
|
||
|
or put a ticket at Support Center .<br />Thank you so much!
|
||
|
</p>
|
||
|
</div>
|
||
|
</section>
|
||
|
|
||
|
<!--HTML Structure-->
|
||
|
<section class="section html-structure" id="html-structure">
|
||
|
<div class="sec-title">
|
||
|
<h2>HTML Structure</h2>
|
||
|
</div>
|
||
|
|
||
|
<br />
|
||
|
<div class="sec-content">
|
||
|
<h3>
|
||
|
The html template uses Latest <strong>Bootstrap 5</strong> with valid
|
||
|
HTML5 tags. This theme is a responisve layout with 4 column Support
|
||
|
column. All of the information in content area is nested within a class
|
||
|
and comes with predefined classes.
|
||
|
</h3>
|
||
|
|
||
|
<div class="html-code">
|
||
|
<img src="images/html-sample.png" alt="image html"/>
|
||
|
</div>
|
||
|
<br>
|
||
|
<br>
|
||
|
<div class="html-code">
|
||
|
<h2>Output</h2>
|
||
|
<br>
|
||
|
<img src="images/output.png" alt="image html"/>
|
||
|
</div>
|
||
|
</div>
|
||
|
</section>
|
||
|
|
||
|
<!--CSS Structure-->
|
||
|
<section class="section css-structure" id="css-structure">
|
||
|
<div class="sec-title">
|
||
|
<h2>SASS Files and Structure</h2>
|
||
|
</div>
|
||
|
|
||
|
<br />
|
||
|
<div class="sec-content">
|
||
|
<h3>
|
||
|
Mainly three main CSS files are used in this theme. The first one
|
||
|
<strong>bootstrap.css</strong>, second one is
|
||
|
<strong>style.css</strong> which for this template and third one is
|
||
|
<strong>responsive.css</strong> to control responsive layouts.
|
||
|
</h3>
|
||
|
<p>
|
||
|
If you would like to edit a specific section of the site, simply find
|
||
|
the appropriate label in the CSS file, and then scroll down until you
|
||
|
find the appropriate style that needs to be edited.
|
||
|
</p>
|
||
|
<h2>We used SASS for better productivity</h2>
|
||
|
<p>
|
||
|
Instead of working with large css file we break them into three pieces
|
||
|
</p>
|
||
|
<p>
|
||
|
<strong>Elements:</strong> We keep every modular elements style in this
|
||
|
folder. Module files are name according to their class name. For naming
|
||
|
convention we used BEM method.
|
||
|
</p>
|
||
|
<p><strong>General:</strong> General styles are written here.</p>
|
||
|
<p><strong>Sections:</strong> Section specific styles are written here.</p>
|
||
|
|
||
|
<div class="html-code">
|
||
|
<br>
|
||
|
<img src="images/css.png" alt="image html"/>
|
||
|
</div>
|
||
|
</div>
|
||
|
</section>
|
||
|
|
||
|
<!--Javascript-->
|
||
|
<section class="section javascript" id="javascript">
|
||
|
<div class="sec-title">
|
||
|
<h2>Jquery and javascript</h2>
|
||
|
</div>
|
||
|
|
||
|
<br />
|
||
|
<div class="sec-content">
|
||
|
<h3>This theme imports three types of Javascript files.</h3>
|
||
|
<ul>
|
||
|
<li>jQuery</li>
|
||
|
<li>Custom scripts <strong>(custom.js)</strong></li>
|
||
|
<li>Scripts for google map <strong>(custom.js)</strong></li>
|
||
|
<li>Use Some plugins file</li>
|
||
|
<br />
|
||
|
<li>
|
||
|
<strong>jQuery</strong> is a Javascript library that greatly reduces
|
||
|
the amount of code that you must write.
|
||
|
</li>
|
||
|
<li>
|
||
|
Most of the animation in this site is carried out from the customs
|
||
|
scripts. There are a few functions worth looking over.
|
||
|
</li>
|
||
|
</ul>
|
||
|
<br />
|
||
|
<p>
|
||
|
In addition to the custom scripts, I have implemented few "tried and
|
||
|
true" plugins to create the effects. This plugin is packed, so you won't
|
||
|
need to manually edit anything in the file. The only necessary thing to
|
||
|
know is how to call the method
|
||
|
</p>
|
||
|
|
||
|
<div class="html-code">
|
||
|
<br>
|
||
|
<img src="images/js.png" alt="image html"/>
|
||
|
</div>
|
||
|
</div>
|
||
|
</section>
|
||
|
|
||
|
<!--contact-form Settings-->
|
||
|
<section class="section map-settings" id="contact-form">
|
||
|
<div class="sec-title">
|
||
|
<h2>Contact form Structure</h2>
|
||
|
</div>
|
||
|
|
||
|
<br />
|
||
|
<div class="sec-content">
|
||
|
<div class="html-code">
|
||
|
<img src="images/contact.png" alt="image html"/>
|
||
|
</div>
|
||
|
<br>
|
||
|
<br>
|
||
|
<h2>Output</h2>
|
||
|
<br>
|
||
|
<div class="html-code">
|
||
|
<img src="images/output2.png" alt="image html"/>
|
||
|
</div>
|
||
|
<br>
|
||
|
</div>
|
||
|
</section>
|
||
|
|
||
|
<!--required-file-->
|
||
|
<section class="section map-settings" id="required-file">
|
||
|
<div class="sec-title">
|
||
|
<h2>Required File</h2>
|
||
|
</div>
|
||
|
|
||
|
<br />
|
||
|
<div class="sec-content">
|
||
|
<h2>Required Css</h2>
|
||
|
<br>
|
||
|
<div class="html-code">
|
||
|
<img src="images/required-css.png" alt="image html"/>
|
||
|
</div>
|
||
|
<br>
|
||
|
<br>
|
||
|
<div class="html-code">
|
||
|
<h2>Required Js</h2>
|
||
|
<br>
|
||
|
<img src="images/required-js.png" alt="image html"/>
|
||
|
</div>
|
||
|
</div>
|
||
|
</section>
|
||
|
|
||
|
<!--logo Structure-->
|
||
|
<section class="section map-settings" id="logo-area">
|
||
|
<div class="sec-title">
|
||
|
<h2>Logo Structure</h2>
|
||
|
</div>
|
||
|
|
||
|
<br />
|
||
|
<div class="sec-content">
|
||
|
<div class="html-code">
|
||
|
<img src="images/logo.png" alt="image html"/>
|
||
|
</div>
|
||
|
<br>
|
||
|
<br>
|
||
|
<div class="sec-content">
|
||
|
<h2>Output</h2>
|
||
|
<br>
|
||
|
<div class="html-code">
|
||
|
<img src="images/output3.png" alt="image html"/>
|
||
|
</div>
|
||
|
<br>
|
||
|
</div>
|
||
|
</div>
|
||
|
</section>
|
||
|
|
||
|
<!--about Structure-->
|
||
|
<section class="section map-settings" id="about-area">
|
||
|
<div class="sec-title">
|
||
|
<h2>About Structure</h2>
|
||
|
</div>
|
||
|
<br />
|
||
|
<div class="sec-content">
|
||
|
<h2>About area</h2>
|
||
|
<br>
|
||
|
<div class="html-code">
|
||
|
<img src="images/about.png" alt="image html"/>
|
||
|
</div>
|
||
|
</div>
|
||
|
<br>
|
||
|
<div class="sec-content">
|
||
|
<h2>Output</h2>
|
||
|
<br>
|
||
|
<div class="html-code">
|
||
|
<img src="images/output4.png" alt="image html"/>
|
||
|
</div>
|
||
|
<br>
|
||
|
</div>
|
||
|
|
||
|
</section>
|
||
|
|
||
|
<!--service Structure-->
|
||
|
<section class="section map-settings" id="service-area">
|
||
|
<div class="sec-title">
|
||
|
<h2>Fact Area Structure</h2>
|
||
|
</div>
|
||
|
|
||
|
<br />
|
||
|
<div class="sec-content">
|
||
|
<div class="html-code">
|
||
|
<img src="images/fact.png" alt="image html"/>
|
||
|
</div>
|
||
|
</div>
|
||
|
</section>
|
||
|
|
||
|
<!--video Structure-->
|
||
|
<section class="section map-settings" id="video-area">
|
||
|
<div class="sec-title">
|
||
|
<h2>Video Area Structure</h2>
|
||
|
</div>
|
||
|
|
||
|
<br />
|
||
|
<div class="sec-content">
|
||
|
<div class="html-code">
|
||
|
<img src="images/video.png" alt="image html"/>
|
||
|
</div>
|
||
|
</div>
|
||
|
</section>
|
||
|
|
||
|
<!--faq Structure-->
|
||
|
<section class="section map-settings" id="faq-area">
|
||
|
<div class="sec-title">
|
||
|
<h2>Featured Area Structure</h2>
|
||
|
</div>
|
||
|
|
||
|
<br />
|
||
|
<div class="sec-content">
|
||
|
<div class="html-code">
|
||
|
<img src="images/featured.png" alt="image html"/>
|
||
|
</div>
|
||
|
</div>
|
||
|
</section>
|
||
|
|
||
|
<!--testimonial Structure-->
|
||
|
<section class="section map-settings" id="testimonial-area">
|
||
|
<div class="sec-title">
|
||
|
<h2>testimonial Area Structure</h2>
|
||
|
</div>
|
||
|
|
||
|
<br />
|
||
|
<div class="sec-content">
|
||
|
<div class="html-code">
|
||
|
<img src="images/testimonial.png" alt="image html"/>
|
||
|
</div>
|
||
|
</div>
|
||
|
</section>
|
||
|
|
||
|
<!--team Structure-->
|
||
|
<section class="section map-settings" id="team-area">
|
||
|
<div class="sec-title">
|
||
|
<h2>CTA Area Structure</h2>
|
||
|
</div>
|
||
|
|
||
|
<br />
|
||
|
<div class="sec-content">
|
||
|
<div class="html-code">
|
||
|
<img src="images/cta.png" alt="image html"/>
|
||
|
</div>
|
||
|
</div>
|
||
|
</section>
|
||
|
|
||
|
<!--team Structure-->
|
||
|
<section class="section map-settings" id="service-area">
|
||
|
<div class="sec-title">
|
||
|
<h2>Course Area Structure</h2>
|
||
|
</div>
|
||
|
|
||
|
<br />
|
||
|
<div class="sec-content">
|
||
|
<div class="html-code">
|
||
|
<img src="images/service.png" alt="image html"/>
|
||
|
</div>
|
||
|
</div>
|
||
|
</section>
|
||
|
|
||
|
<!--blog Structure-->
|
||
|
<section class="section map-settings" id="blog-area">
|
||
|
<div class="sec-title">
|
||
|
<h2>blog Area Structure</h2>
|
||
|
</div>
|
||
|
|
||
|
<br />
|
||
|
<div class="sec-content">
|
||
|
<div class="html-code">
|
||
|
<img src="images/blog.png" alt="image html"/>
|
||
|
</div>
|
||
|
</div>
|
||
|
</section>
|
||
|
|
||
|
<!--Footer Structure-->
|
||
|
<section class="section map-settings" id="footer-area">
|
||
|
<div class="sec-title">
|
||
|
<h2>Footer Menu Structure</h2>
|
||
|
</div>
|
||
|
|
||
|
<br />
|
||
|
<div class="sec-content">
|
||
|
<div class="html-code">
|
||
|
<img src="images/footer.png" alt="image html"/>
|
||
|
</div>
|
||
|
</div>
|
||
|
</section>
|
||
|
|
||
|
<!--Footer Structure-->
|
||
|
<section class="section map-settings" id="copyright-area">
|
||
|
<div class="sec-title">
|
||
|
<h2>Copy Right Structure</h2>
|
||
|
</div>
|
||
|
|
||
|
<br />
|
||
|
<div class="sec-content">
|
||
|
<div class="html-code">
|
||
|
<img src="images/copyright.png" alt="image html"/>
|
||
|
</div>
|
||
|
</div>
|
||
|
</section>
|
||
|
|
||
|
<!--Feature area-->
|
||
|
<section class="section sources-credits" id="Feature-card">
|
||
|
<div class="sec-title">
|
||
|
<h2>Features</h2>
|
||
|
</div>
|
||
|
|
||
|
<br />
|
||
|
<div class="sec-content">
|
||
|
<ul>
|
||
|
<li>SASS File Included</li>
|
||
|
<li>100% pixel perfect design</li>
|
||
|
<li>Clean and Simple Style</li>
|
||
|
<li>Smooth transition effects.</li>
|
||
|
<li>Cross Browser Optimization.</li>
|
||
|
<li>Google font.</li>
|
||
|
<li>Compatible Browsers – IE9+, Chrome, Safari, Opera, Firefox</li>
|
||
|
<li>Documentation – Yes</li>
|
||
|
<li>License – GPL</li>
|
||
|
<li>Version – 1.0.0</li>
|
||
|
<li>Columns – 4</li>
|
||
|
<li>Files Included -html, JS, css</li>
|
||
|
<li>User Friendly Code</li>
|
||
|
<li>Easy to customize</li>
|
||
|
<li>W3C Validation</li>
|
||
|
<li>Clean & Modern Design</li>
|
||
|
<li>CSS3 animations</li>
|
||
|
<li>Full Responsive</li>
|
||
|
<li>SEO friendly code</li>
|
||
|
</ul>
|
||
|
</div>
|
||
|
<div class="sec-title">
|
||
|
<h2>Pages</h2>
|
||
|
</div>
|
||
|
<br />
|
||
|
<div class="sec-content">
|
||
|
<ul>
|
||
|
<li>3 Homepages</li>
|
||
|
<li>About</li>
|
||
|
<li>Service</li>
|
||
|
<li>Service Details</li>
|
||
|
<li>Project</li>
|
||
|
<li>Project Details</li>
|
||
|
<li>Blog</li>
|
||
|
<li>Blog Details</li>
|
||
|
<li>Contact</li>
|
||
|
</ul>
|
||
|
</div>
|
||
|
|
||
|
</section>
|
||
|
|
||
|
<!--Sources and Credits-->
|
||
|
<section class="section sources-credits" id="sources-credits">
|
||
|
<div class="sec-title">
|
||
|
<h2>Sources and Credits</h2>
|
||
|
</div>
|
||
|
|
||
|
<br />
|
||
|
<div class="sec-content">
|
||
|
<h3>
|
||
|
Fonts Used int the template are google fonts, you can find theme on
|
||
|
Google Fonts API
|
||
|
</h3>
|
||
|
|
||
|
<p><strong>Font Used:</strong></p>
|
||
|
<ul>
|
||
|
<li><a href="https://fonts.google.com/specimen/Inter+Sans">"Inter", sans-serif;</a></li>
|
||
|
</ul>
|
||
|
|
||
|
<ul class="source-files">
|
||
|
<li><a href="http://www.getbootstrap.com/" target="_blank" title="Bootstrap">Bootstrap</a></li>
|
||
|
<li><a href="https://fonts.google.com/" target="_blank" title="Google Fonts">Google Fonts</a></li>
|
||
|
<li><a href="https://fontawesome.com/v 5.15.2/">Font Awesome</a></li>
|
||
|
</ul>
|
||
|
|
||
|
|
||
|
<br>
|
||
|
Every Code is properly commented for Editing Ease.
|
||
|
</div>
|
||
|
</section>
|
||
|
|
||
|
<!--Support-->
|
||
|
<section class="section support" id="support">
|
||
|
<div class="sec-title">
|
||
|
<h2>Support</h2>
|
||
|
</div>
|
||
|
|
||
|
<br />
|
||
|
<div class="sec-content">
|
||
|
<h3>
|
||
|
Once again, thank you so much for purchasing this theme. As I said at
|
||
|
the beginning, I'd be glad to help you if you have any questions
|
||
|
relating to this theme. No guarantees, but I'll do my best to assist. If
|
||
|
you have any queries, please feel free to contact us at Support Center. <strong>wowtheme7@gmail.com</strong>
|
||
|
</h3>
|
||
|
|
||
|
<p>Email Us at : <a href="#">wowtheme7@gmail.com</a></p>
|
||
|
</div>
|
||
|
</section>
|
||
|
</div>
|
||
|
</div>
|
||
|
<!--End pagewrapper-->
|
||
|
|
||
|
<script src="js/jquery.js"></script>
|
||
|
<script src="js/bootstrap.min.js"></script>
|
||
|
<script src="js/jquery.nav.js"></script>
|
||
|
<script src="js/jquery.scrollTo.js"></script>
|
||
|
<script src="js/scrollbar.js"></script>
|
||
|
<script src="js/script.js"></script>
|
||
|
</body>
|
||
|
</html>
|