Xido Introduction
This documentation will give you an understanding of how Politicia template is structured and guide you in performing common functions.
If you want to customize, please contact us here: [email protected]
Author: PBM InfotechInstallation
Follow the steps below to get started with your Site Template:
- Open the ... /Template Folder to find all the Templates Files
- You will need to Upload these files to your Web Server using FTP in order to use it on your Website.
-
Make sure you upload the required files/folders listed below:
- html/css - Stylesheets Folder
- html/fonts - Fonts Folder
- html/images - Images Folder
- html/js - Javacripts Folder
- html/index.html - (and All HTML files)
- You're now good to go..! Start adding your Content and show off your Brand New Beautiful Website in style.
Basic template Structure
The template has a responsive layout and is based on the Bootstrap V4 Framework . Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web. Click Here to know more about Bootstrap.
HTML Structure
The general HTML structure is the same throughout the template. Here is thegeneral HTML structure of the template:
<!DOCTYPE html> <html lang="en"> <head> [Page meta, page css, page title etc...] </head> <body> <!-- page wrapper --> <div class="page-wrapper"> <!--header --> <header id="site-header" class="header"> <div id="header-wrap"> [MENU CONTENT] </div> </header> <!--header --> <!-- page content --> <div class="page-content"> <!--Section 1 --> <section> [SECTION 1 CONTENT] </section> <!--Section 1 --> <!--Section 2 --> <section> [SECTION 2 CONTENT] </section> <!--Section 2 --> </div> <!-- page content --> <!--footer --> <footer class="footer"> [FOOTER_CONTENT] </footer> <!--footer --> </div> <!-- page wrapper --> [PAGE JAVASCRIPTS HERE] </body> </html>
CSS Structure
The general CSS structure is the same throughout the template. Here is the general CSS structure of the template:
<!-- Bootstrap CSS --> <link rel="stylesheet" href="css/bootstrap.min.css"> <!-- Fontawesome --> <link rel="stylesheet" href="css/fontawesome.css"> <!-- Flaticon --> <link rel="stylesheet" href="css/flaticon.css"> <!-- Doctery Icons --> <link rel="stylesheet" href="css/pbminfotech-base-icons.css"> <!-- Themify Icons --> <link rel="stylesheet" href="css/themify-icons.css"> <!-- Slick --> <link rel="stylesheet" href="css/swiper.min.css"> <!-- Magnific --> <link rel="stylesheet" href="css/magnific-popup.css"> <!-- AOS --> <link rel="stylesheet" href="css/aos.css"> <!-- Shortcode CSS --> <link rel="stylesheet" href="css/shortcode.css"> <!-- Base CSS --> <link rel="stylesheet" href="css/base.css"> <!-- Style CSS --> <link rel="stylesheet" href="css/style.css"> <!-- Responsive CSS --> <link rel="stylesheet" href="css/responsive.css">
Javascript Structure
The general Javascript structure is the same throughout the template. Here is the general Javascript structure of the template:
<!-- jQuery JS --> <script src="js/jquery.min.js"></script> <!-- Popper JS --> <script src="js/popper.min.js"></script> <!-- Bootstrap JS --> <script src="js/bootstrap.min.js"></script> <!-- jquery Waypoints JS --> <script src="js/jquery.waypoints.min.js"></script> <!-- jquery Appear JS --> <script src="js/jquery.appear.js"></script> <!-- Numinate JS --> <script src="js/numinate.min.js"></script> <!-- Slick JS --> <script src="js/swiper.min.js"></script> <!-- Magnific JS --> <script src="js/jquery.magnific-popup.min.js"></script> <!-- Circle Progress JS --> <script src="js/circle-progress.js"></script> <!-- AOS --> <script src="js/aos.js"></script> <!-- Scripts JS --> <script src="js/scripts.js"></script>
Favicon icon
Favicon is an icon associated with the URL that is displayed at various places, such as in a browser’s address bar or next to the site name in a bookmark list.
You can add a Favicon to your Website using the following code:
<link rel="shortcut icon" href="images/favicon.ico"/>
Logo Settings
The Logo Container can be found in the Header Container - Replace "logo-white.png" with your own logo image URL.
<a href="index.html"><img src="images/logo-dark.png" alt="logo"></a>
Note Default height of logo is 60px. you can set height according to your logo type and your requirement.
Changing Fonts style
You can add/change the site font, from all fonts used from Google Web Font Services, with the one that suits you the best. You can find the font link in css folder base.css file. See example below:
<!-- 'DM+Sans' --> @import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap" rel="stylesheet'); <!-- 'Quicksand' --> @import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300;400;500;600;700&display=swap" rel="stylesheet'); <!-- 'Asap:ital' --> @import url('https://fonts.googleapis.com/css2?family=Asap:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap" rel="stylesheet');
In order to change the fonts, you will need to edit the above links with your custom font, You can easily use Google Web Font Services if you plan to use a Google Font or remove it completely. If you plan to use a self hosted font, here is an Example of using Self Hosted Fonts
Helper Classes
We have created some really useful helper classes for you. These classes help you to quick position elements without writing new CSS rules. These classes are generic helper classes predefined in the CSS pages, here is quick view what they can do
Section title
You can use this code for your page section title to maintain title style.
<div class="pbmit-heading-subheading"> <h4 class="pbmit-subtitle">Subheading</h4> <h2 class="pbmit-title">Your Title</h2> </div>
Background color
You can use color in the background. simply add .pbmit-bg-color-global (or any color you want) class where you want to use. See example below:
<div class="pbmit-bg-color-global"> [YOUR CONTENT] </div>
Note We include 4 background color helper class in our template pbmit-bg-color-global, pbmit-bg-color-secondary, pbmit-bg-color-light and pbmit-bg-color-blackish You can add unlimited background color class according to your needs
Background Image
You can use an image in the background simply add InlineStyle in div tag and by use of this you can create your own bg. See example below:
<div style="background:url(Path); "> [YOUR CONTENT] </div>
Sliders
- Swiper Slider
Swiper Slider
This excellent carousel slider can be controlled using HTML5 data attributes.
Find the full online Swiper Slider documentation .
Shortcode
- Accordion
- Buttons
- Blog Post
- Counter
- Icon Box
- Service Box
- Progress Bar
- Team
- Testimonials
Accordion
Use the below code to display accordion:
<div class="accordion" id="accordionExample"> <div class="accordion-item"> <h2 class="accordion-header" id="headingOne"> <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne"> Accordion Item #1 </button> </h2> <div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample"> <div class="accordion-body"> <strong>This is the first item's accordion body.</strong> It is shown by default, until the collapse plugin adds the appropriate classes </div> </div> </div> </div>
Button
Use the below to display Default Buttons:
Class | Code | Description | Result |
---|---|---|---|
.pbmit-btn |
<a href="blog-grid.html" class="pbmit-btn"><span>Button</span> </a> |
Button | Button |
.pbmit-btn .pbmit-btn-outline |
<a href="#" class="pbmit-btn pbmit-btn-outline"><span>See more manifesto</span></a> |
Outline Button | Button |
Counter
Use the below code to display Counter style:
Counter Style 1
<div class="pbminfotech-ele-fid-style-1 "> <div class="pbmit-fld-contents"> <div class="pbmit-fld-wrap"> <h4 class="pbmit-fid-inner d-flex"> <span class="pbmit-fid"></span> <span class="pbmit-number-rotate numinate" data-appear-animation="animateDigits" data-from="0" data-to="5" data-interval="1" data-before="" data-before-style="" data-after="" data-after-style="">5</span> <span class="pbmit-fid"><sup>M+</sup></span> </h4> <div class="pbmit-fid-title">Worldwide Product sale per year</div> </div> </div> </div>
Counter Style 2
<div class="pbminfotech-ele-fid-style-2 "> <div class="pbmit-fld-contents"> <div class="pbmit-circle-outer" data-digit="80" data-fill="#452b90" data-emptyfill="#fff" data-before="" data-after="<sup>%</sup>" data-thickness="8" data-size="130"> <div class="pbmit-circle"> <canvas width="130" height="130"></canvas> <h4 class="pbmit-fid-inner"> <span class="pbmit-number-rotate numinate" data-appear-animation="animateDigits" data-from="0" data-to="80" data-interval="5" data-before="" data-before-style="" data-after="" data-after-style="">80</span> <sup>%</sup> </h4> </div> <div class="pbmit-fld-wrap"> <div class="pbmit-fid-title">Facilitate the transfer of real economic resources.</div> </div> </div> </div> </div>
Counter Style 3
<div class="pbminfotech-ele-fid-style-3 "> <div class="pbmit-fld-contents"> <div class="pbmit-fld-wrap"> <h4 class="pbmit-fid-inner d-flex"> <span class="pbmit-fid"></span> <span class="pbmit-number-rotate" data-appear-animation="animateDigits" data-from="0" data-to="98.5" data-interval="5" data-before="" data-before-style="" data-after="" data-after-style="">99</span> <span class="pbmit-fid"><sup>%</sup></span> </h4> <div class="pbmit-fid-title">Client Satisfaction</div> </div> </div> </div>
Counter Style 4
<div class="pbminfotech-ele-fid-style-4 "> <div class="pbmit-fld-contents align-items-center"> <div class="pbmit-fld-wrap"> <h4 class="pbmit-fid-inner d-flex"> <span class="pbmit-fid"></span> <span class="pbmit-number-rotate numinate" data-appear-animation="animateDigits" data-from="0" data-to="133" data-interval="5" data-before="" data-before-style="" data-after="" data-after-style="">133</span> <span class="pbmit-fid"><span>K</span></span> </h4> <div class="pbmit-fid-title"><span>Trusted Companies </span> </div> </div> </div> </div>
Counter Style 5
<div class="pbminfotech-ele-fid-style-5 "> <div class="pbmit-fld-contents"> <h4 class="pbmit-fid-inner d-flex"> <span class="pbmit-fid"></span> <span class="pbmit-number-rotate numinate" data-appear-animation="animateDigits" data-from="0" data-to="20" data-interval="1" data-before="" data-before-style="" data-after="" data-after-style="">20</span> <span class="pbmit-fid"><sup>+</sup></span> </h4> <div class="pbmit-fld-wrap"> <div class="pbmit-fid-title">Professional financial advisors available in there. </div> </div> </div> </div>
Counter Style 6
<div class="pbminfotech-ele-fid-style-6 "> <div class="pbmit-fld-contents"> <div class="pbmit-fld-wrap"> <h3 class="pbmit-fid-title"><span>People</span></h3> <h4 class="pbmit-fid-inner d-flex"> <span class="pbmit-fid"></span> <span class="pbmit-number-rotate numinate" data-appear-animation="animateDigits" data-from="0" data-to="15" data-interval="5" data-before="" data-before-style="" data-after="" data-after-style="">15</span> <span class="pbmit-fid"><span>k</span></span> </h4> <div class="pbmit-fid-description"> <div class="pbmit-heading-desc">The best experts in field</div> </div> </div> </div> </div>
Counter Style 7
<div class="pbminfotech-ele-fid-style-7 "> <div class="pbmit-fld-contents"> <div class="pbmit-circle-outer" data-digit="80" data-fill="#452b90" data-emptyfill="#fff" data-before="" data-after="<sup>%</sup>" data-thickness="8" data-size="130"> <div class="pbmit-circle"> <canvas width="130" height="130"></canvas> <h4 class="pbmit-fid-inner"> <span class="pbmit-number-rotate" data-appear-animation="animateDigits" data-from="0" data-to="80" data-interval="5" data-before="" data-before-style="" data-after="" data-after-style="">80</span> <sup>%</sup> </h4> </div> <div class="pbmit-fid-sub"> <h3 class="pbmit-fid-title">Work Progress</h3> </div> </div> </div> </div>
Counter Style 8
<div class="pbminfotech-ele-fid-style-8 "> <div class="pbmit-fld-contents"> <div class="pbmit-fld-wrap"> <h3 class="pbmit-fid-title"><span>World Offices</span></h3> <h4 class="pbmit-fid-inner d-flex"> <span class="pbmit-fid"></span> <span class="pbmit-number-rotate numinate" data-appear-animation="animateDigits" data-from="0" data-to="250" data-interval="5" data-before="" data-before-style="" data-after="" data-after-style="">250</span> <span class="pbmit-fid"><span>+</span></span> </h4> <div class="pbmit-fid-description"> <div class="pbmit-heading-desc">Work in many countries</div> </div> </div> </div> </div>
Counter Style 9
<div class="pbminfotech-ele-fid-style-9 "> <div class="pbmit-fld-contents"> <div class="pbmit-fld-wrap"> <h4 class="pbmit-fid-inner d-flex"> <span class="pbmit-fid"></span> <span class="pbmit-number-rotate numinate" data-appear-animation="animateDigits" data-from="0" data-to="323" data-interval="5" data-before="" data-before-style="" data-after="" data-after-style="">323</span> <span class="pbmit-fid"><span>K+</span></span> </h4> <div class="pbmit-fid-title">Daily Notifications</div> </div> </div> </div>
Counter Style 10
<div class="pbminfotech-ele-fid-style-10 "> <div class="pbmit-fld-contents"> <div class="pbmit-circle-outer" data-digit="80" data-fill="#f98a5a" data-emptyfill="#fff" data-before="" data-after="<sup>%</sup>" data-thickness="11" data-size="160"> <div class="pbmit-circle"> <canvas width="160" height="160"></canvas> <h4 class="pbmit-fid-inner"> <span class="pbmit-number-rotate numinates" data-appear-animation="animateDigits" data-from="0" data-to="80" data-interval="5" data-before="" data-before-style="" data-after="" data-after-style="">80</span> <sup>%</sup> </h4> </div> <div class="pbmit-fld-wrap"> <h3 class="pbmit-fid-title">Digital Marketing</h3> <div class="pbmit-fid-description"> <div class="pbmit-heading-desc">Generates competition, which leads to better products</div> </div> </div> </div> </div> </div>
Counter Style 11
<div class="pbminfotech-ele-fid-style-11 "> <div class="pbmit-fld-contents"> <div class="pbmit-fld-wrap"> <div class="pbmit-sbox-icon-wrapper"> <div class="pbmit-icon-wrapper pbmit-icon-type-icon"><i class="pbmit-xido-icon-social-media-marketing"></i></div> </div> <h3 class="pbmit-fid-title">Experience</h3> <h4 class="pbmit-fid-inner d-flex"> <span class="pbmit-fid"></span> <span class="pbmit-number-rotate" data-appear-animation="animateDigits" data-from="0" data-to="15" data-interval="5" data-before="" data-before-style="" data-after="" data-after-style="">15</span> <span class="pbmit-fid"><span>+</span></span> </h4> </div> </div> </div>
Icon box
Use the below code to display Icon box style:
Icon box Style 1
<div class="pbmit-ihbox-style-1"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper pbmit-ihbox-icon-type-image"> <img src="images/Agency/icon/icon-img-01.png" alt="Digital Marketing" /> </div> </div> <div class="pbmit-ihbox-contents"> <h2 class="pbmit-element-title"> Digital Marketing </h2> <div class="pbmit-heading-desc"> An agency usually provides a service, like organization. </div> </div> </div>
Icon box Style 2
<div class="pbmit-ihbox-style-2"> <div class="pbmit-ihbox-box d-flex align-items-center"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper pbmit-ihbox-icon-type-image"> <img src="images/Coworking/icon/team-01.jpg" alt="Icon" /> </div> </div> <div class="pbmit-ihbox-headingicon"> <div>"Stay on top of market trends, build your portfolio and execute"</div> </div> </div> </div>
Icon box Style 3
<div class="pbmit-ihbox-style-3"> <div class="pbmit-ihbox-box"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper"> <div class="pbmit-icon-wrapper pbmit-icon-type-icon"> <i class="pbmit-xido-icon-book"></i> </div> </div> </div> <div class="pbmit-ihbox-contents"> <h2 class="pbmit-element-title">Work material</h2> <div class="pbmit-heading-desc"> We provide the best working material business development marketing planning operations. </div> <div class="pbmit-ihbox-btn"> <a href="#"><span>View all info</span></a> </div> </div> </div> </div>
Icon box Style 4
<div class="pbmit-ihbox-style-4"> <div class="pbmit-ihbox-box"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper"> <div class="pbmit-icon-wrapper pbmit-icon-type-icon"> <i class="pbmit-xido-icon-profit"></i> </div> </div> </div> <div class="pbmit-ihbox-contents"> <h2 class="pbmit-element-title">Flexible membership</h2> <div class="pbmit-heading-desc"> We have a flexible team membership are excellent developer passionate about their work. </div> </div> </div> </div>
Icon box Style 5
<div class="pbmit-ihbox-style-5"> <div class="pbmit-ihbox-headingicon d-flex align-items-center"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper pbmit-ihbox-icon-type-image"> <img src="images/creative/megaphone.png" class="img-fluid" alt="Compensation" /> </div> </div> <div class="pbmit-ihbox-contents"> <h2 class="pbmit-element-title">Compensation</h2> <div class="pbmit-heading-desc">Praesent neque hendr facilisis elit mattis.</div> </div> </div> </div>
Icon box Style 6
<div class="pbmit-ihbox-style-6"> <div class="pbmit-ihbox-box"> <div class="pbmit-ihbox-headingicon d-flex align-items-center"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper"> <div class="pbmit-icon-wrapper pbmit-icon-type-icon"> <i class="pbmit-xido-icon-boost"></i> </div> </div> </div> <div class="pbmit-ihbox-contents"> <h2 class="pbmit-element-title">Great Design Proposals</h2> <div class="pbmit-heading-desc">Praesent at neque hendrerit facilisis augue mattis neque.</div> </div> </div> </div> </div>
Icon box Style 7
<div class="pbmit-ihbox-style-7"> <div class="pbmit-ihbox-box"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper pbmit-ihbox-icon-type-text">01</div> </div> <div class="pbmit-ihbox-contents"> <h2 class="pbmit-element-title">Our History</h2> <div class="pbmit-heading-desc"> Duis malesuada bibendum facilisis elit aliquam fringilla ligula, non finibus eget sapien nullam vehicula convallis. </div> </div> </div> </div>
Icon box Style 8
<div class="pbmit-ihbox-style-8"> <div class="pbmit-ihbox-box"> <div class="pbmit-ihbox-contents"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper pbmit-ihbox-icon-type-image"> <img src="images/internet/router.png" class="img-fluid" alt="Flexible Package" /> </div> </div> <h2 class="pbmit-element-title">Flexible Package</h2> <div class="pbmit-heading-desc"> This provides every of the devices on your dwelling network with internet access. </div> <div class="pbmit-ihbox-btn"> <a href="#"><span>Read More</span></a> </div> </div> </div> </div>
Icon box Style 9
<div class="pbmit-ihbox-style-9"> <div class="pbmit-ihbox-box d-flex align-items-center"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper"> <div class="pbmit-icon-wrapper pbmit-icon-type-icon"> <i class="pbmit-xido-icon-cloud-computing"></i> </div> </div> </div> <div class="pbmit-ihbox-contents"> <h2 class="pbmit-element-title">Discover, Explore the Product</h2> <div class="pbmit-heading-desc"> An effective campaign demands a great deal of time and planning run a marketing. </div> </div> </div> </div>
Icon box Style 10
<div class="pbmit-ihbox-style-10"> <div class="pbmit-ihbox-box"> <div class="pbmit-ihbox-contents"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper"> <div class="pbmit-icon-wrapper pbmit-icon-type-icon"> <i class="pbmit-xido-icon-seo"></i> </div> </div> </div> <h2 class="pbmit-element-title">SEO Analytics</h2> <div class="pbmit-heading-desc"> SEO analysis requires brands to first take a careful look at the content </div> </div> </div> </div>
Icon box Style 11
<div class="pbmit-ihbox-style-11"> <div class="pbmit-ihbox-box"> <div class="pbmit-ihbox-contents"> <div class="pbmit-ihbox-content-inner d-flex align-items-center"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper"> <div class="pbmit-icon-wrapper pbmit-icon-type-icon"> <i class="fa-check-circle"></i> </div> </div> </div> <div class="pbmit-ihbox-heading-inner"> <h2 class="pbmit-element-title">Creative Advertising</h2> </div> </div> <div class="pbmit-heading-desc"> Creative agencies perform number of functions for clients from strategy & design, to media. </div> </div> </div> </div>
Icon box Style 12
<div class="pbmit-ihbox-style-12"> <div class="pbmit-ihbox-box d-flex align-items-center"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper"> <div class="pbmit-icon-wrapper pbmit-icon-type-icon"> <i class="pbmit-xido-icon-ppc"></i> </div> </div> </div> <div class="pbmit-ihbox-contents"> <h2 class="pbmit-element-title">No credit card required </h2> </div> </div> </div>
Icon box Style 13
<div class="pbmit-ihbox-style-13"> <div class="pbmit-ihbox-box"> <div class="pbmit-ihbox-contents"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper"> <div class="pbmit-icon-wrapper pbmit-icon-type-icon"> <i class="pbmit-xido-icon-team"></i> </div> </div> </div> <h2 class="pbmit-element-title">Top equipment</h2> <div class="pbmit-heading-desc">We provide top modern equipment's business development.</div> </div> </div> </div>
Icon box Style 14
<div class="pbmit-ihbox-style-14"> <div class="pbmit-ihbox-box"> <div class="pbmit-ihbox-contents"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper pbmit-ihbox-icon-type-icon"> <div class="pbmit-icon-wrapper pbmit-icon-type-icon"> <i class="pbmit-xido-icon-boost"></i> </div> </div> </div> <h2 class="pbmit-element-title">Audience Targeting</h2> <div class="pbmit-heading-desc"> Phasellus urna felis, vehicula a ultricie imperdiet, vulputate ut mauris ac ultricies. </div> </div> </div> </div>
Icon box Style 15
<div class="pbmit-ihbox-style-15"> <div class="pbmit-ihbox-box"> <div class="pbmit-ihbox-contents"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper"> <div class="pbmit-icon-wrapper pbmit-icon-type-icon"> <i class="pbmit-xido-icon-3d-cube"></i> </div> </div> </div> <h2 class="pbmit-element-title">High Visualization</h2> <div class="pbmit-heading-desc"> Proin sit etiam nibh tincidunt viverra nunc sit amet laoreet odiom sagittis. </div> </div> </div> </div>
Icon box Style 16
<div class="pbmit-ihbox-style-16"> <div class="pbmit-ihbox-box"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper pbmit-ihbox-icon-type-icon"> <div class="pbmit-icon-wrapper pbmit-icon-type-icon"> <i class="pbmit-xido-icon-vr-glasses"></i> </div> </div> </div> <div class="pbmit-ihbox-contents"> <h2 class="pbmit-element-title">360 Virtual Reality Glasses</h2> <div class="pbmit-heading-desc"> Suspendisse lobortis turpis risus eu mollis libero porta ut curabitur ornare imperdiet. </div> </div> </div> </div>
Icon box Style 17
<div class="pbmit-ihbox-style-17"> <div class="pbmit-ihbox-box"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper"></div> </div> <div class="pbmit-ihbox-contents"> <div class="pbmit-html-code-box"> <lottie-player src="https://assets1.lottiefiles.com/private_files/lf30_mwPqHM.json" background="transparent" speed="1" style="width: 100%;height: 100%" loop="" autoplay=""></lottie-player> </div> <h2 class="pbmit-element-title">On Knowing audience</h2> <div class="pbmit-heading-desc"> After you sell stocks, you must wait for the trade to settle before you can withdraw money from your brokerage account. </div> <div class="pbmit-ihbox-btn"> <a href="#"><span>View All Info</span></a> </div> </div> </div> </div>
Icon box Style 18
<div class="pbmit-ihbox-style-18"> <div class="pbmit-ihbox-box"> <div class="pbmit-ihbox-contents"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper"> <div class="pbmit-icon-wrapper pbmit-icon-type-icon"> <i class="pbmit-xido-icon-global-marketing"></i> </div> </div> </div> <h2 class="pbmit-element-title">Market analysis</h2> </div> </div> </div>
Icon box Style 19
<div class="pbmit-ihbox-style-19"> <div class="pbmit-ihbox-box d-flex"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper pbmit-ihbox-icon-type-text">01</div> </div> <div class="pbmit-ihbox-contents"> <h2 class="pbmit-element-title">Company Analytics</h2> <div class="pbmit-heading-desc"> Neque porro est qui dolorem ipsum quia quaed inventore veritatis. </div> </div> </div> </div>
Icon box Style 20
<div class="pbmit-ihbox-style-20"> <div class="pbmit-ihbox-box d-flex align-items-center"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper"> <div class="pbmit-icon-wrapper pbmit-icon-type-icon"> <i class="pbmit-xido-icon-email"></i> </div> </div> </div> <div class="pbmit-ihbox-contents"> <div class="pbmit-heading-desc">Send Email</div> <h2 class="pbmit-element-title">[email protected]</h2> </div> </div> </div>
Icon box Style 21
<div class="pbmit-ihbox-style-21"> <div class="pbmit-ihbox-box"> <div class="pbmit-ihbox-contents"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper"> <div class="pbmit-icon-wrapper pbmit-icon-type-icon"> <i class="pbmit-xido-icon-local-network"></i> </div> </div> </div> <h2 class="pbmit-element-title">Market analysis</h2> </div> </div> </div>
Icon box Style 22
<div class="pbmit-ihbox-style-22"> <div class="pbmit-ihbox-box"> <div class="pbmit-ihbox-contents"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper pbmit-ihbox-icon-type-text"> 01 </div> </div> <h2 class="pbmit-element-title">Company Analytics</h2> <div class="pbmit-heading-desc"> Neque porro est qui dolorem ipsum quia quaed inventore veritatis et quasi. </div> </div> </div> </div>
Icon box Style 23
<div class="pbmit-ihbox-style-23"> <div class="pbmit-ihbox-box"> <div class="pbmit-ihbox-contents"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper"></div> </div> <h2 class="pbmit-element-title">Western university</h2> <div class="pbmit-heading-desc"> <span>1987 - 1992 - </span>Quisq comdo simply free. </div> </div> </div> </div>
Icon box Style 24
<div class="pbmit-ihbox-style-24"> <div class="pbmit-ihbox-box"> <div class="pbmit-ihbox-contents"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper pbmit-ihbox-icon-type-image"> <img src="images/hosting/icon/icon-img-01.png" class="img-fluid" alt="" /> </div> </div> <h2 class="pbmit-element-title">99.9% Uptime Guarantee </h2> <div class="pbmit-heading-desc"> Share processes and data secure lona need to know basis </div> <div class="pbmit-ihbox-btn"> <a href="#"><span>Read More</span></a> </div> </div> </div> </div>
Icon box Style 25
<div class="pbmit-ihbox-style-25"> <div class="pbmit-ihbox-box d-flex"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper pbmit-ihbox-icon-type-text"> 01 </div> </div> <div class="pbmit-ihbox-contents"> <h2 class="pbmit-element-title">Collaborate</h2> <div class="pbmit-heading-desc"> Work as a team to help your customers get all the answers dropped a clanger </div> </div> </div> </div>
Icon box Style 26
<div class="pbmit-ihbox-style-26"> <div class="pbmit-ihbox-box"> <div class="pbmit-ihbox-headingicon d-flex align-items-center"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper"> <div class="pbmit-icon-wrapper pbmit-icon-type-icon"> <i class="pbmit-xido-icon-settings"></i> </div> </div> </div> <div class="pbmit-ihbox-contents"> <h2 class="pbmit-element-title">Free 15-Days Use Trial</h2> </div> </div> </div> </div>
Icon box Style 27
<div class="pbmit-ihbox-style-27"> <div class="pbmit-ihbox-box"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper"> <div class="pbmit-icon-wrapper pbmit-icon-type-icon"> <i class="pbmit-xido-cyber-icon-hacker"></i> </div> </div> </div> <div class="pbmit-ihbox-contents"> <h2 class="pbmit-element-title">Highly Professional Members</h2> <div class="pbmit-ihbox-btn"> <a href="#"><span>LEARN MORE</span></a> </div> </div> </div> </div>
Icon box Style 28
<div class="pbmit-ihbox-style-28"> <div class="pbmit-ihbox-box"> <div class="pbmit-ihbox-contents"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper pbmit-ihbox-icon-type-text">1</div> </div> <h2 class="pbmit-element-title">Implementation of a Confidentiality</h2> <div class="pbmit-heading-desc"> Share processes and data secure lona need to know basis molestie sem ultrices augue. </div> </div> </div> </div>
Icon box Style 29
<div class="pbmit-ihbox-style-29"> <div class="pbmit-ihbox-icon"> <div class="pbmit-ihbox-icon-wrapper"> <div class="pbmit-icon-wrapper pbmit-icon-type-icon"> <i class="pbmit-xido-hr-software-icon-hiring"></i> </div> </div> </div> <div class="pbmit-ihbox-contents"> <h2 class="pbmit-element-title">Truly Integrated</h2> <div class="pbmit-heading-desc"> Our Cyber Security Consulting backs your organization with years of best experience on projects. </div> </div> </div>
Service Box
Use the below code to display Service Box style:
Service Box Style 1
<article class="pbmit-service-style-1"> <div class="pbminfotech-post-item"> <div class="pbmit-service-icon-wrapper"> <i class="pbmit-xido-icon-customer-behavior"></i> </div> <div class="pbminfotech-box-content"> <h3 class="pbmit-service-title"> <a href="#">Work Management</a></h3> <div class="pbmit-service-content"> <p>Curabitur facilisis lectus vitae arcu sodales, eu blandit ante malesuada.</p> </div> </div> <div class="pbmit-service-btn"> <a class="btn-arrow" href="#"></a> </div> </div> </article>
Service Box Style 2
<article class="pbmit-service-style-2"> <div class="pbminfotech-post-item"> <div class="pbmit-service-image-wrapper"> <div class="pbmit-featured-img-wrapper"> <div class="pbmit-featured-wrapper"> <img src="images/creative/service/service-01.jpg" class="img-fluid" alt="" /> </div> </div> </div> <div class="pbminfotech-box-content"> <div class="pbmit-service-cat"> <h4> <a href="#" rel="tag">Corporate</a> </h4> </div> <h3 class="pbmit-service-title"> <a href="#">People Management</a> </h3> </div> </div> </article>
Service Box Style 3
<article class="pbmit-service-style-3"> <div class="pbminfotech-post-item"> <div class="pbmit-service-icon-wrapper"> <i class="pbmit-xido-icon-laptop"></i> </div> <div class="pbminfotech-box-content"> <h3 class="pbmit-service-title"> <a href="#">Business Service</a> </h3> <div class="pbmit-service-content"> <p>Tempor lorem ipsum dolor sit ametcon sectetur adip iscing eiusmod tempor.</p> </div> </div> <div class="pbmit-service-btn"> <a class="btn-arrow" href="#"> Read More</a> </div> </div> </article>
Service Box Style 4
<article class="pbmit-service-style-4"> <div class="pbminfotech-post-item"> <div class="pbmit-service-image-wrapper"> <div class="pbmit-featured-img-wrapper"> <div class="pbmit-featured-wrapper"> <img src="images/Seo/service/service-07.jpg" class="img-fluid" alt="" /> </div> </div> </div> <div class="pbminfotech-box-content"> <div class="pbminfotech-box-content-inner"> <div class="pbmit-service-cat"> <a href="#" rel="tag">Hosting</a> </div> <h3 class="pbmit-service-title"> <a href="#">Creative Advertising</a> </h3> </div> </div> </div> </article>
Service Box Style 5
<article class="pbmit-service-style-5"> <div class="pbminfotech-post-item"> <div class="pbmit-service-icon-wrapper"> <i class="pbmit-xido-icon-video-marketing-1"></i> </div> <div class="pbminfotech-box-content"> <h3 class="pbmit-service-title"> <a href="#">Monitoring Ranking</a> </h3> <div class="pbmit-service-btn"> <a class="btn-arrow" href="#"> <span class="pbmit-arrow"></span> </a> </div> </div> </div> </article>
Service Box Style 6
<article class="pbmit-service-style-6"> <div class="pbminfotech-post-item"> <div class="pbmit-service-image-wrapper"> <div class="pbmit-featured-img-wrapper"> <div class="pbmit-featured-wrapper"> <img src="images/Finance/service/service-01.jpg" class="img-fluid w-100" alt="" /> </div> </div> </div> <div class="pbminfotech-box-content"> <div class="pbminfotech-box-content-inner"> <div class="pbmit-service-icon-wrapper"> <i class="pbmit-xido-icon-bar-chart"></i> </div> <div class="pbmit-service-title-wrapper"> <div class="pbmit-service-cat"> <a href="#" rel="tag">Business</a> </div> <h3 class="pbmit-service-title"> <a href="#">Digital & Analytics</a> </h3> </div> </div> </div> </div> </article>
Service Box Style 7
<article class="pbmit-service-style-7"> <div class="pbminfotech-post-item"> <div class="pbmit-service-icon-wrapper"> <i class="pbmit-xido-icon-global-services"></i> </div> <div class="pbminfotech-box-content"> <h3 class="pbmit-service-title"> <a href="#">Consulting Service</a> </h3> <div class="pbmit-service-content"> <p>Diam magna consectetur nunc tristique consequat. Integer venenatis nec rutrum.</p> </div> </div> <div class="pbmit-service-btn"> <a class="btn-arrow" href="#"> Read More</a> </div> </div> </article>
Service Box Style 8
<article class="pbmit-service-style-8"> <div class="pbminfotech-post-item"> <div class="pbmit-service-icon-wrapper"> <i class="pbmit-xido-hosting-icon-cloud-server"></i> </div> <div class="pbminfotech-box-content"> <h3 class="pbmit-service-title"> <a href="#">Automatic Scalability</a> </h3> </div> <div class="pbmit-service-btn"> <a class="btn-arrow" href="#"> Read More</a> </div> </div> </article>
Service Box Style 9
<article class="pbmit-service-style-9"> <div class="pbminfotech-post-item"> <div class="pbmit-service-icon-wrapper"> <i class="pbmit-xido-cyber-icon-hacker"></i> </div> <div class="pbminfotech-box-content"> <h3 class="pbmit-service-title"> <a href="#">Application Security</a> </h3> <div class="pbmit-service-content"> <p>Diam magna consectetur nunc tristique consequat. Integer venenatis nec rutrum voluptatibus maiores.</p> </div> </div> </div> </article>
Progress Bar
Use the below code to display Progress Bar style:
<div class="progressbar"> <span class="progress-label">Biotechnology</span> <div class="progress progress-lg progress-percent-bg"> <div class="progress-bar aos aos-init aos-animate" data-aos="slide-right" data-aos-delay="200" data-aos-duration="1000" data-aos-easing="ease-in-out" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100"> <span class="progress-percent">80%</span> </div> </div> </div>
Team
Use the below code to display Team:.
Team Style 1
<article class="pbmit-team-style-1"> <div class="pbminfotech-post-item"> <div class="pbmit-featured-img-wrapper"> <div class="pbmit-featured-wrapper"> <img src="images/Agency/team/team-01.jpg" class="img-fluid w-100" alt="" /> </div> </div> <div class="pbminfotech-social-box"> <div class="pbminfotech-box-social-links"> <ul class="pbmit-social-links pbmit-team-social-links"> <li class="pbmit-social-li pbmit-social-facebook"> <a href="#" title="Facebook" target="_blank"> <span><i class="pbmit-base-icon-facebook-squared"></i></span> </a> </li> <li class="pbmit-social-li pbmit-social-twitter"> <a href="#" title="Twitter" target="_blank"> <span><i class="pbmit-base-icon-twitter"></i></span> </a> </li> <li class="pbmit-social-li pbmit-social-instagram"> <a href="#" title="Instagram" target="_blank"> <span><i class="pbmit-base-icon-instagram"></i></span> </a> </li> <li class="pbmit-social-li pbmit-social-youtube"> <a href="#" title="Youtube" target="_blank"> <span><i class="pbmit-base-icon-youtube-play"></i></span> </a> </li> </ul> </div> </div> <div class="pbminfotech-box-content"> <div class="pbminfotech-box-content-inner"> <h3 class="pbmit-team-title"> <a href="#">Michael Daniel</a> </h3> <div class="pbminfotech-team-position"> <div class="pbminfotech-box-team-position">Project Manager</div> </div> </div> </div> </div> </article>
Team Style 2
<article class="pbmit-team-style-2"> <div class="pbminfotech-post-item"> <div class="pbminfotech-team-image-box"> <div class="pbminfotech-box-social-links"> <ul class="pbmit-social-links pbmit-team-social-links"> <li class="pbmit-social-li pbmit-social-facebook"> <a href="#" title="Facebook" target="_blank"> <span><i class="pbmit-base-icon-facebook-squared"></i></span> </a> </li> <li class="pbmit-social-li pbmit-social-twitter"> <a href="#" title="Twitter" target="_blank"> <span><i class="pbmit-base-icon-twitter"></i></span> </a> </li> <li class="pbmit-social-li pbmit-social-instagram"> <a href="#" title="Instagram" target="_blank"> <span><i class="pbmit-base-icon-instagram"></i></span> </a> </li> <li class="pbmit-social-li pbmit-social-youtube"> <a href="#" title="Youtube" target="_blank"> <span><i class="pbmit-base-icon-youtube-play"></i></span> </a> </li> </ul> </div> <div class="pbmit-featured-img-wrapper"> <div class="pbmit-featured-wrapper"> <img src="images/Coworking/team/team-01.jpg" class="img-fluid" alt="" /> </div> </div> </div> <div class="pbminfotech-box-content"> <div class="pbminfotech-box-content-inner"> <h3 class="pbmit-team-title"> <a href="#">Michael Daniel</a> </h3> <div class="pbminfotech-team-position"> <div class="pbminfotech-box-team-position">Project Manager</div> </div> </div> </div> </div> </article>
Team Style 3
<article class="pbmit-team-style-3"> <div class="pbminfotech-post-item"> <div class="pbmit-featured-img-wrapper"> <div class="pbmit-featured-wrapper"> <img src="images/Coworking/team/team-01.jpg" class="img-fluid" alt="" /> </div> </div> <div class="pbminfotech-social-box"> <div class="pbminfotech-box-social-links"> <ul class="pbmit-social-links pbmit-team-social-links"> <li class="pbmit-social-li pbmit-social-facebook"> <a href="#" title="Facebook" target="_blank"> <span><i class="pbmit-base-icon-facebook-squared"></i></span> </a> </li> <li class="pbmit-social-li pbmit-social-twitter"> <a href="#" title="Twitter" target="_blank"> <span><i class="pbmit-base-icon-twitter"></i></span> </a> </li> <li class="pbmit-social-li pbmit-social-instagram"> <a href="#" title="Instagram" target="_blank"> <span><i class="pbmit-base-icon-instagram"></i></span> </a> </li> <li class="pbmit-social-li pbmit-social-youtube"> <a href="#" title="Youtube" target="_blank"> <span><i class="pbmit-base-icon-youtube-play"></i></span> </a> </li> </ul> </div> </div> <div class="pbminfotech-box-content"> <div class="pbminfotech-box-content-inner"> <h3 class="pbmit-team-title"> <a href="#">Michael Daniel</a> </h3> <div class="pbminfotech-team-position"> <div class="pbminfotech-box-team-position">Project Manager</div> </div> </div> </div> </div> </article>
Testimonial
Use the below code to display Testimonial:.
Testimonial Style 1
<article class="pbmit-testimonial-style-1"> <div class="pbminfotech-post-item"> <div class="pbminfotech-box-content"> <div class="pbminfotech-box-desc"> <blockquote class="pbminfotech-testimonial-text"> <p>We are so many grateful for your guidance and encouragement have helped us get to where we are today. You have our immense thanks for all of the support you’ve given us.</p> </blockquote> </div> </div> <div class="pbminfotech-author-box d-flex justify-content-between align-items-center"> <div class="pbminfotech-author-wrapper d-flex align-items-center"> <div class="pbminfotech-box-img"> <div class="pbmit-featured-img-wrapper"> <div class="pbmit-featured-wrapper"> <img src="images/social-media/testimonial/testimonial-01.jpg" class="img-fluid" alt="" /> </div> </div> </div> <div class="pbminfotech-box-author"> <h3 class="pbminfotech-box-title">Andrew Paul</h3> <div class="pbminfotech-testimonial-detail">CEO of Xido</div> </div> </div> <div class="pbminfotech-testimonial-rating"> <div class="pbminfotech-box-star-ratings"> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> </div> </div> </div> </div> </article>
Testimonial Style 2
<article class="pbmit-testimonial-style-2"> <div class="pbminfotech-post-item d-flex align-items-center"> <div class="pbminfotech-box-img"> <div class="pbmit-featured-img-wrapper"> <div class="pbmit-featured-wrapper"> <img src="images/business/testimonail/testimonial-01.jpg" class="img-fluid" alt="" /> </div> </div> </div> <div class="pbminfotech-box-content"> <div class="pbminfotech-box-star-ratings"> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> </div> <div class="pbminfotech-testimonial-wrapper"> <div class="pbminfotech-box-desc"> <blockquote class="pbminfotech-testimonial-text text-white"> <p>We are so grateful for the your guidance and encouragement that we have learned from you. You have our immense thanks for all of the support you’ve given us.</p> </blockquote> </div> <div class="pbminfotech-author-wrapper "> <div class="pbminfotech-box-author d-flex align-items-center"> <h3 class="pbminfotech-box-title">Amelia Daniel</h3> <div class="pbminfotech-testimonial-detail text-white">Market Analyst</div> </div> </div> </div> </div> </div> </article>
Testimonial Style 3
<article class="pbmit-testimonial-style-3"> <div class="pbminfotech-post-item"> <div class="pbminfotech-box-content"> <div class="pbminfotech-box-desc"> <blockquote class="pbminfotech-testimonial-text"> <p>I am so grateful for everything that I have learned from you. You have my immense thanks for all of the support you’ve given me.</p> </blockquote> </div> <div class="pbminfotech-testimonial-wrapper d-flex align-items-center"> <div class="pbminfotech-box-img"> <div class="pbmit-featured-img-wrapper"> <div class="pbmit-featured-wrapper"> <img src="images/Coworking/testimonial/testimonial-01.jpg" class="img-fluid" alt="" /> </div> </div> </div> <div class="pbminfotech-author-wrapper"> <div class="pbminfotech-box-author"> <h3 class="pbminfotech-box-title">Amelia Daniel</h3> <div class="pbminfotech-testimonial-detail">Market Analyst</div> </div> </div> </div> </div> </div> </article>
Testimonial Style 4
<article class="pbmit-testimonial-style-4"> <div class="pbminfotech-post-item"> <div class="pbminfotech-star-ratging-box"> <div class="pbminfotech-box-star-ratings"> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> </div> </div> <div class="pbminfotech-box-content"> <div class="pbminfotech-box-desc"> <blockquote class="pbminfotech-testimonial-text"> <p>We are so many grateful for your guidance and encouragement have helped us get to where we are today. You have our immense thanks for all of the support you’ve given us.</p> </blockquote> </div> <div class="pbminfotech-author-wrapper d-flex align-items-center"> <div class="pbminfotech-box-img"> <div class="pbmit-featured-img-wrapper"> <div class="pbmit-featured-wrapper"> <img src="images/internet/testimonail/testimonial-01.jpg" class=" img-fluid" alt="" /> </div> </div> </div> <div class="pbminfotech-box-author"> <h3 class="pbminfotech-box-title">Amelia Daniel</h3> <div class="pbminfotech-testimonial-detail">Market Analyst</div> </div> </div> </div> </div> </article>
Testimonial Style 5
<article class="pbmit-testimonial-style-5"> <div class="pbminfotech-post-item"> <div class="pbminfotech-box-content"> <div class="pbminfotech-box-desc"> <blockquote class="pbminfotech-testimonial-text"> <p>We are so grateful for everything that we have learned from you. You have our immense thanks for all of the support you’ve given us.</p> </blockquote> </div> <div class="pbminfotech-author-wrapper"> <div class="pbminfotech-box-star-ratings"> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> </div> <div class="pbminfotech-box-author d-flex align-items-center"> <h3 class="pbminfotech-box-title">Amelia Daniel</h3> <div class="pbminfotech-testimonial-detail">Market Analyst</div> </div> </div> </div> </div> </article>
Testimonial Style 6
<article class="pbmit-testimonial-style-6"> <div class="pbminfotech-post-item d-flex align-items-center"> <div class="pbminfotech-box-img"> <div class="pbmit-featured-img-wrapper"> <div class="pbmit-featured-wrapper"> <img src="images/startup/testimonial/testimonial-01.jpg" class="img-fluid w-100" alt="" /> </div> </div> </div> <div class="pbminfotech-box-content"> <div class="pbminfotech-box-star-ratings"> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> </div> <div class="pbminfotech-testimonial-wrapper"> <div class="pbminfotech-box-desc"> <blockquote class="pbminfotech-testimonial-text"> <p>We are so grateful for the your guidance and encouragement that we have learned from you. You have our immense thanks for all of the support you’ve given us.</p> </blockquote> </div> <div class="pbminfotech-author-wrapper "> <div class="pbminfotech-box-author d-flex align-items-center"> <h3 class="pbminfotech-box-title">Amelia Daniel</h3> <div class="pbminfotech-testimonial-detail">Market Analyst</div> </div> </div> </div> </div> </div> </article>
Testimonial Style 7
<article class="pbmit-testimonial-style-7"> <div class="pbminfotech-post-item"> <div class="pbminfotech-star-ratging-box"> <div class="pbminfotech-box-star-ratings"> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> </div> </div> <div class="pbminfotech-box-content"> <div class="pbminfotech-box-desc"> <blockquote class="pbminfotech-testimonial-text"> <p>We are grateful for everything that we have learned from you. You have a our immense thanks for all support you’ve given us.</p> </blockquote> </div> <div class="pbminfotech-author-wrapper d-flex align-items-center"> <div class="pbminfotech-box-img"> <div class="pbmit-featured-img-wrapper"> <div class="pbmit-featured-wrapper"> <img src="images/virtualreality/testimonail/testimonial-01.jpg" class="img-fluid" alt="" /> </div> </div> </div> <div class="pbminfotech-box-author"> <h3 class="pbminfotech-box-title">Amelia Daniel</h3> <div class="pbminfotech-testimonial-detail">Market Analyst</div> </div> </div> </div> </div> </article>
Testimonial Style 8
<article class="pbmit-testimonial-style-8"> <div class="pbminfotech-post-item"> <div class="pbminfotech-box-content"> <div class="pbminfotech-box-desc"> <blockquote class="pbminfotech-testimonial-text"> <p>I am so grateful for everything that I have learned from you. You have my immense thanks for all of the support you’ve given me.</p> </blockquote> </div> <div class="pbminfotech-author-wrapper"> <div class="pbminfotech-box-star-ratings"> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> </div> <div class="pbminfotech-box-author d-flex align-items-center"> <h3 class="pbminfotech-box-title">Amelia Daniel</h3> <div class="pbminfotech-testimonial-detail">Market Analyst</div> </div> </div> </div> </div> </article>
Testimonial Style 9
<article class="pbmit-testimonial-style-9"> <div class="pbminfotech-post-item d-flex"> <div class="pbminfotech-box-img"> <div class="pbmit-featured-img-wrapper"> <div class="pbmit-featured-wrapper"> <img src="images/hosting/testimonial/testimonial-1.jpg" class="img-fluid w-100" alt="" /> </div> </div> </div> <div class="pbminfotech-box-content"> <div class="pbminfotech-testimonial-wrapper"> <div class="pbminfotech-box-desc"> <blockquote class="pbminfotech-testimonial-text"> <p>We are so many grateful for everything that we have learned from you. You have our immense thanks for all of the support you’ve given us.</p> </blockquote> </div> <div class="pbminfotech-author-wrapper "> <div class="pbminfotech-box-author"> <h3 class="pbminfotech-box-title">Amelia Daniel</h3> <div class="pbminfotech-testimonial-detail">Market Analyst</div> </div> </div> </div> </div> </div> </article>
Testimonial Style 10
<article class="pbmit-testimonial-style-10"> <div class="pbminfotech-post-item d-flex align-items-center"> <div class="pbminfotech-box-img"> <div class="pbmit-featured-img-wrapper"> <div class="pbmit-featured-wrapper"> <img src="images/cyber-security/testimonial/testimonial-01.jpg" alt="" /> </div> </div> </div> <div class="pbminfotech-box-content"> <div class="pbminfotech-box-star-ratings"> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> <i class="pbmit-base-icon-star pbmit-active"></i> </div> <div class="pbminfotech-testimonial-wrapper"> <div class="pbminfotech-box-desc"> <blockquote class="pbminfotech-testimonial-text"> <p>We are so grateful for the your guidance and encouragement that we have learned from you. You have our immense thanks for the support you’ve given us.</p> </blockquote> </div> <div class="pbminfotech-author-wrapper "> <div class="pbminfotech-box-author d-flex align-items-center"> <h3 class="pbminfotech-box-title">Amelia Daniel</h3> <div class="pbminfotech-testimonial-detail">Market Analyst</div> </div> </div> </div> </div> </div> </article>
Browser Support
Hectolab supports all major Browsers like Google Chrome, Mozilla Firefox, Safari, Opera, Internet Explorer 10 and above.
How to rate this item
If you like our theme and support, Please do not forget to rate it with 5 stars in your Downloads
section and write a review in Comments as it will add more value to our services!
Kindly visit here:
http://themeforest.net/downloads
and find "Rate this item" below the download button and rate out the theme.
Advance Thanks in Anticipation!
Source & Credits
All images and videos are for preview purposes only and are not included in the download files. Images are of copyrights under Creative Commons CC0.
Images
Scripts
- Jquery
- Popper
- Jquery appear
- Jquery Waypoints
- Jquery Numinate
- Magnific Popup
- Swiper Js
- Jquery Circle Progress
CSS & Fonts
Note For questions on basic HTML, Javascript or CSS editing - please give your question a quick Google or visit W3Schools as template issues get top priority. You will need some knowledge of HTML/CSS to edit the template.