Restaurant User Guide

On behalf of DesignerByte team, we would like to thank you for purchasing this item. Your support encourages us to build better items and continuously bring value to our products. This documentation file covers all the information needed to install and use this Template. You'll find everything you need to know to create a stunning and beautiful website in minutes.

Restaurant Introduction

This documentation will give you an understanding of how Restaurant template is structured and guide you in performing common functions.

If you want to customize, please contact us here: contact@pbminfotech.com

Author: PBM Infotech

Installation

Follow the steps below to get started with your Site Template:

  1. Open the ... /Template Folder to find all the Templates Files
  2. You will need to Upload these files to your Web Server using FTP in order to use it on your Website.
  3. 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)
    The other files can be used according to your preferences.
  4. 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');

<!-- 'Kanit' -->
@import url('https://fonts.googleapis.com/css2?family=Kanit:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet');

<!-- 'Cormorant' -->
@import url('https://fonts.googleapis.com/css2?family=Cormorant:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap" rel="stylesheet');

<!-- 'Space Grotesk' -->
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap" rel="stylesheet');

<!-- 'Marcellus' -->
@import url('https://fonts.googleapis.com/css2?family=Marcellus&display=swap" rel="stylesheet'); 

<!-- 'Oswald' -->
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200;300;400;500;600;700&display=swap" rel="stylesheet');

<!-- 'Yantramanav' -->
@import url('https://fonts.googleapis.com/css2?family=Yantramanav:wght@100;300;400;500;700;900&display=swap" rel="stylesheet');

<!-- 'Montserrat' -->
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet');

<!-- 'Lato' -->
@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap" rel="stylesheet');

<!-- 'Playfair Display' -->
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet');

<!-- 'Ubuntu' -->
@import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap" rel="stylesheet');

<!-- 'Schibsted Grotesk' -->
@import url('https://fonts.googleapis.com/css2?family=Schibsted+Grotesk:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet');

<!-- 'Jost   ' -->
@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="styleshee');

<!-- 'Tangerine' -->
@import url('https://fonts.googleapis.com/css2?family=Tangerine:wght@400;700&display=swap" rel="stylesheet');

<!-- 'Josefin Sans' -->
@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;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 active">
    <h2 class="accordion-header" id="headingOne">
        <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
            BUILDING THE FUTURE CITIES
        </button>
    </h2>
    <div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
        <div class="accordion-body">
            Many people has the notion that enlightenment is one state. Many also believe that when it is attained, a person is forever in that state for your necessary discernment. Thank you for reading.
        </div>
    </div>
</div>                      
</div>

Button

Use the below to display Default Buttons:

Class Code Description Result
.pbmit-btn 
<a href="#" class="pbmit-btn">
    <span class="pbmit-header-button2-text">Button
       <svg class="pbmit-svg-arrow" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" x="0px" y="0px" width="10" height="19" viewBox="0 0 19 19" xml:space="preserve"><line x1="1" y1="18" x2="17.8" y2="1.2"></line><line x1="1.2" y1="1" x2="18" y2="1"></line><line x1="18" y1="17.8" x2="18" y2="1"></line></svg>
    </span>			
 </a>
 Button button
.pbmit-btn .pbmit-btn-outline 
<a href="#" class="pbmit-btn pbmit-btn-outline-black">
    <span class="pbmit-header-button2-text">Button
       <svg class="pbmit-svg-arrow" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" x="0px" y="0px" width="10" height="19" viewBox="0 0 19 19" xml:space="preserve"><line x1="1" y1="18" x2="17.8" y2="1.2"></line><line x1="1.2" y1="1" x2="18" y2="1"></line><line x1="18" y1="17.8" x2="18" y2="1"></line></svg>
    </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 d-flex align-items-center">
            <span class="pbmit-number-rotate-big" data-appear-animation="animateDigits" data-from="0" data-to="10 " data-interval="5" data-before="" data-before-style="" data-after="" data-after-style="">
                10	</span>
            <span class="pbmit-fid-sub-big"></span>
            <h4 class="pbmit-fid-inner">
                <span class="pbmit-number-rotate numinate" data-appear-animation="animateDigits" data-from="0" data-to="10" data-interval="5" data-before="" data-before-style="" data-after="" data-after-style="">10</span>
                <span class="pbmit-fid-sub"></span>
            </h4>
            <h3 class="pbmit-fid-title"><span>years of <br> experience<br></span></h3>
        </div>
    </div>
</div>
Counter Style 2
<div class="pbminfotech-ele-fid-style-2 ">
    <div class="pbmit-fld-contents">
        <div class="pbmit-fld-wrap">
            <h4 class="pbmit-fid-inner">
                <span class="pbmit-number-rotate numinate" data-appear-animation="animateDigits" data-from="0" data-to="12" data-interval="1" data-before="" data-before-style="" data-after="" data-after-style="">12</span>
                <span class="pbmit-fid-sub"><sup>+</sup></span>
            </h4>
            <h3 class="pbmit-fid-title"><span>Years of <br>experience<br></span></h3>
        </div>
    </div>
</div>
Counter Style 3
<div class="pbminfotech-ele-fid-style-3">
    <div class="pbmit-fld-contents">
        <div class="pbmit-fld-wrap d-flex align-items-center">
            <h4 class="pbmit-fid-inner">
                <span class="pbmit-number-rotate numinate" data-appear-animation="animateDigits" data-from="0" data-to="150" data-interval="10" data-before="" data-before-style="" data-after="" data-after-style="">150</span>
                <span class="pbmit-fid-sub"><sup>k</sup></span>
            </h4>
            <h3 class="pbmit-fid-title">
                <span>Project <br> Completed <br></span>
            </h3>
        </div>
    </div>
</div>
Counter Style 4
<div class="pbminfotech-ele-fid-style-4">
    <div class="pbmit-fld-contents">
        <div class="pbmit-fld-wrap d-flex align-items-center">
            <div class="pbmit-big-number">
                <span class="pbmit-number-rotate-big" 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>
            </div>
            <h4 class="pbmit-fid-inner">
                <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>
            </h4>
            <h3 class="pbmit-fid-title">
                <span>Expert <br> Doctors<br></span>
            </h3>
        </div>
    </div>
</div>
Counter Style 5
<div class="pbminfotech-ele-fid-style-5 architect-fid">
    <div class="pbmit-fld-contents">
        <div class="pbmit-fld-wrap d-flex align-items-center">
            <div class="pbmit-big-number">
                <span class="pbmit-number-rotate-big" data-appear-animation="animateDigits" data-from="0" data-to="12" data-interval="5" data-before="" data-before-style="" data-after="" data-after-style="">
                12	</span>
                <span class="pbmit-fid-sub-big"></span>
            </div>
            <h4 class="pbmit-fid-inner">
                <span class="pbmit-number-rotate numinate" data-appear-animation="animateDigits" data-from="0" data-to="12" data-interval="5" data-before="" data-before-style="" data-after="" data-after-style="">12</span>
                <span class="pbmit-fid-sub"></span>
            </h4>
            <h3 class="pbmit-fid-title">
                <span>Award <br> Winning<br></span>
            </h3>
        </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">
                <span class="pbmit-number-rotate numinate" data-appear-animation="animateDigits" data-from="0" data-to="30" data-interval="5" data-before="" data-before-style="" data-after="" data-after-style="">80</span>
                <span class="pbmit-fid-sub"><span>%</span></span>
            </h4>
            <div class="pbmit-fid-title"><span>Years of experience</span> urban <br> design draws together.</div>
        </div>
    </div>
</div>
Counter Style 10
<div class="pbminfotech-ele-fid-style-10 ">
    <div class="pbmit-fld-contents">
        <div class="pbmit-fld-wrap">
            <h4 class="pbmit-fid-inner">
                <span class="pbmit-number-rotate numinate" data-appear-animation="animateDigits" data-from="0" data-to="12" data-interval="3" data-before="" data-before-style="" data-after="" data-after-style="">12</span>
                <span class="pbmit-fid-sub"><span>K</span></span>
            </h4>
            <h3 class="pbmit-fid-title"><span>Happy User Around World</span></h3>
        </div>
    </div>
</div>
Counter Style 11
<div class="pbminfotech-ele-fid-style-11 ">
    <div class="pbmit-fld-contents">
        <div class="pbmit-fld-wrap">
            <h4 class="pbmit-fid-inner">
                <span class="pbmit-number-rotate numinate" data-appear-animation="animateDigits" data-from="0" data-to="25" data-interval="5" data-before="" data-before-style="" data-after="" data-after-style="">25</span>
                <span class="pbmit-fid-sub"></span>
            </h4>
            <div class="pbmit-fid-title">Year of Experience</div>
        </div>
    </div>
</div>
Counter Style 12
<div class="pbminfotech-ele-fid-style-12 ">
    <div class="pbmit-fld-contents">
    <div class="pbmit-fld-wrap">
        <h4 class="pbmit-fid-inner">
            <span class="pbmit-number-rotate numinate" data-appear-animation="animateDigits" data-from="0" data-to="25" data-interval="5" data-before="" data-before-style="" data-after="" data-after-style="">25</span>
            <span class="pbmit-fid-sub"></span>
        </h4>
        <div class="pbmit-fid-title">Year of Experience</div>
    </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-box text-center">
        <div class="pbmit-ihbox-icon">
            <div class="pbmit-ihbox-icon-wrapper">
                <div class="pbmit-icon-wrapper pbmit-icon-type-icon">
                <i class="pbmit-bexco-marketing-icon pbmit-bexco-marketing-icon-vector-1"></i>
                </div>
            </div>
        </div>			
        <h2 class="pbmit-element-title">Analysis & idea</h2>
        <div class="pbmit-heading-desc">Sed do eiusmod tempor labore dolore magna liqua ad veniam.</div>	
    </div>
</div>
Icon box Style 2
<div class="pbmit-ihbox pbmit-ihbox-style-2">
    <div class="pbmit-ihbox-box d-flex">
        <div class="pbmit-ihbox-icon">
            <div class="pbmit-ihbox-icon-wrapper">
                <div class="pbmit-icon-wrapper pbmit-icon-type-icon">
                <i class="pbmit-bexco-restaurant-icon pbmit-bexco-restaurant-icon-food-serving"></i>
                </div>
            </div>
        </div>
        <div class="pbmit-ihbox-contents">
            <h2 class="pbmit-element-title"> Fresh Product</h2>
            <div class="pbmit-heading-desc">The way Ipsum is simply dummy text of the printing typesetting industry ipsum.</div>
        </div>
    </div>
</div>
Icon box Style 3
<div class="pbmit-ihbox 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-bexco-medical-icon pbmit-bexco-medical-icon-arrow-down"></i>
                </div>
            </div>
        </div>
        <svg xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" version="1.1" viewBox="0 0 200 200">
            <defs>
                <path d="M0, 100a100, 100 0 1, 0 200, 0a100, 100 0 1, 0 -200, 0" id="txt-path"></path>
            </defs>
            <text>
                <textPath startOffset="0" xlink:href="#txt-path">hire us now    -   hire us now    -   hire us now    -   how Re</textPath>
            </text>
        </svg>
    </div>
</div>
Icon box Style 4
<article class="pbmit-miconheading-style-4">
    <div class="pbmit-ihbox pbmit-ihbox-style-4">
        <div class="pbmit-ihbox-box d-flex">
            <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-bexco-gardern-icon pbmit-bexco-gardern-icon-right-arrow"></i>
                </div>
                </div>
            </div>
            <div class="pbmit-ihbox-contents">
                <h2 class="pbmit-element-title"> Affordable</h2>
                <div class="pbmit-heading-desc">you refused to play things safe We combine ideas and behaviors.</div>
            </div>
        </div>
    </div>
</article>
Icon box Style 5
<div class="pbmit-ihbox pbmit-ihbox-style-5 ">
    <div class="pbmit-ihbox-headingicon">
        <div class="pbmit-ihbox-icon">
            <div class="pbmit-ihbox-icon-wrapper pbmit-ihbox-icon-type-text">2019</div>
        </div>
        <div class="pbmit-ihbox-line"></div>
        <div class="pbmit-ihbox-contents">
            <h2 class="pbmit-element-title"> Design Awards</h2>
            <div class="pbmit-heading-desc">Unique digital header widget metaverse wearables did attributing and pushed.</div>
        </div>
    </div>
</div>
Icon box Style 6
<div class="pbmit-ihbox pbmit-ihbox-style-6">
    <div class="pbmit-ihbox-box">
        <div class="pbmit-ihbox-headingicon ">
            <div class="pbmit-ihbox-content-wrapper d-flex align-items-center">
                <div class="pbmit-ihbox-text">
                    <div class="pbmit-ihbox-icon">
                        <div class="pbmit-ihbox-icon-wrapper pbmit-ihbox-icon-type-text">01.</div>
                    </div>
                </div>
                <div class="pbmit-ihbox-title">
                    <h2 class="pbmit-element-title">Planning project</h2>
                </div>
            </div>
            <div class="pbmit-ihbox-contents">
                <div class="pbmit-heading-desc">We love to bring designs to life as a developer, and I aim to do this using necessary.</div>
                <div class="pbmit-ihbox-btn pbmit-svg-btn">
                    <a href="#">
                        <span>READ MORE
                            <svg class="pbmit-svg-arrow" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" x="0px" y="0px" width="19" height="19" viewBox="0 0 19 19" xml:space="preserve">
                                <line x1="1" y1="18" x2="17.8" y2="1.2"></line>
                                <line x1="1.2" y1="1" x2="18" y2="1"></line>
                                <line x1="18" y1="17.8" x2="18" y2="1"></line>
                            </svg>
                        </span>
                    </a>
                </div>
            </div>
        </div>
    </div>
</div>
Icon box Style 7
<div class="pbmit-ihbox pbmit-ihbox-style-7">
    <div class="pbmit-ihbox-box">
        <a class="pbmit-mainih-box" href="#">
            <div class="pbmit-ihbox-icon">
                <div class="pbmit-ihbox-icon-wrapper">
                    <div class="pbmit-icon-wrapper pbmit-icon-type-icon">
                        <i class="pbmit-bexco-lawyer-icon pbmit-bexco-lawyer-icon-legal-1"></i>
                    </div>
                    </div>
            </div>
            <div class="pbmit-ihbox-contents">
                <h2 class="pbmit-element-title"> Best Legal <br> Defence</h2>
            </div>
        </a>
        <div class="pbmit-ihbox-btn pbmit-svg-btn">
            <a href="#">
                <span>View Project
                    <svg class="pbmit-svg-arrow" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" x="0px" y="0px" width="19" height="19" viewBox="0 0 19 19" xml:space="preserve">
                        <line x1="1" y1="18" x2="17.8" y2="1.2"></line>
                        <line x1="1.2" y1="1" x2="18" y2="1"></line>
                        <line x1="18" y1="17.8" x2="18" y2="1"></line>
                    </svg>
                </span>
            </a>
        </div>
    </div>
</div>
Icon box Style 8
<div class="pbmit-ihbox pbmit-ihbox-style-8">
    <div class="pbmit-ihbox-box d-flex align-items-center justify-content-between">
        <div class="pbmit-ihbox-number">
            <div class="pbmit-text-number">
                <div class="pbmit-ihbox-icon">
                    <div class="pbmit-ihbox-icon-wrapper pbmit-ihbox-icon-type-text">2017</div>
                </div>
            </div>
        </div>
        <div class="pbmit-ihbox-heading">
            <h2 class="pbmit-element-title"> Performance awards </h2>
        </div>
        <div class="pbmit-ihbox-contents">
            <div class="pbmit-heading-desc">Getting started with an employee recognition program in your organization? Check out some of favorite employee.</div>
        </div>
        <div class="pbmit-ihbox-btn pbmit-svg-btn">
            <a href="our-history.html">
                <span>Read More
                    <svg class="pbmit-svg-arrow" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" x="0px" y="0px" width="19" height="19" viewBox="0 0 19 19" xml:space="preserve">
                        <line x1="1" y1="18" x2="17.8" y2="1.2"></line>
                        <line x1="1.2" y1="1" x2="18" y2="1"></line>
                        <line x1="18" y1="17.8" x2="18" y2="1"></line>
                    </svg>
                </span>
            </a>
        </div>
    </div>
</div>
Icon box Style 9
<div class="pbmit-ihbox pbmit-ihbox-style-9">
    <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-headingicon">
            <h2 class="pbmit-element-title">Our Mission</h2>
            <div class="pbmit-heading-desc">Sed do eiusmod tempor incididun ut labore dolore magna aliqua enim ad minim veniam.</div>
            <div class="pbmit-ihbox-btn pbmit-svg-btn">
                <a href="blog-grid-col-3.html">
                <span>Read More
                    <svg class="pbmit-svg-arrow" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" x="0px" y="0px" width="19" height="19" viewBox="0 0 19 19" xml:space="preserve">
                        <line x1="1" y1="18" x2="17.8" y2="1.2"></line>
                        <line x1="1.2" y1="1" x2="18" y2="1"></line>
                        <line x1="18" y1="17.8" x2="18" y2="1"></line>
                    </svg>
                </span>
                </a>
            </div>
        </div>
    </div>
</div>
Icon box Style 10
<div class="pbmit-ihbox pbmit-ihbox-style-10">
    <a class="pbmin-lightbox-video" href="https://www.youtube.com/watch?v=7e90gBu4pas">
        <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="fa fa-play"></i>
                    </div>
                </div>
            </div>
            <svg xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" version="1.1" viewBox="0 0 200 200">
                <defs>
                    <path d="M0, 100a100, 100 0 1, 0 200, 0a100, 100 0 1, 0 -200, 0" id="txt-path"></path>
                </defs>
                <text font-size="15" font-family="Miriam Libre,sans-serif" font-weight="400">
                    <textPath startOffset="0" xlink:href="#txt-path">Real Video - Show Real Show</textPath>
                </text>
            </svg>
        </div>
    </a>
</div>
Icon box Style 11
<article class="pbmit-miconheading-style-11">
    <div class="pbmit-ihbox pbmit-ihbox-style-11">
        <div class="pbmit-ihbox-box d-flex">
            <div class="pbmit-ihbox-heading d-flex">
                <h2 class="pbmit-element-title"> Specialty </h2>
            </div>
            <div class="pbmit-ihbox-contents d-flex align-items-center justify-content-between">
                <div class="pbmit-heading-desc">UX Researcher and Instructor</div>
            </div>
        </div>
    </div>
</article>
Icon box Style 13
<div class="pbmit-ihbox pbmit-ihbox-style-13">
    <a class="pbmin-lightbox-video" href="https://www.youtube.com/watch?v=SZEflIVnhH8">
        <div class="pbmit-ihbox-box">
            <div class="pbmit-ihbox-headingicon ">
                <div class="pbmit-ihbox-contents">
                <h2 class="pbmit-element-title"> Play </h2>
                </div>
                <div class="pbmit-ihbox-icon">
                <div class="pbmit-ihbox-icon-wrapper">
                    <div class="pbmit-icon-wrapper pbmit-icon-type-icon">
                        <i class="fa fa-play"></i>
                    </div>
                </div>
                </div>
            </div>
        </div>
    </a>
</div>
Icon box Style 14
<div class="pbmit-ihbox pbmit-ihbox-style-14">
    <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-bexco-medical-icon pbmit-bexco-medical-icon-doctor-1"></i>
                </div>
            </div>
        </div>
        <div class="pbmit-ihbox-contents">
            <h2 class="pbmit-element-title"> expert doctors </h2>
            <div class="pbmit-heading-desc">Procu probo laboramus eius</div>
        </div>
    </div>
</div>
Icon box Style 15
<div class="pbmit-ihbox pbmit-ihbox-style-15">
    <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-bexco-medical-icon pbmit-bexco-medical-icon-emergency-call"></i>
                </div>
            </div>
        </div>
        <div class="pbmit-ihbox-contents">
            <h2 class="pbmit-element-title"> Get Free Consultations!</h2>
            <div class="pbmit-heading-desc">Duis eleifend molestie leo at mollis eros rutrum sit amet nam venenatisenim at magna euismod congue malesuada purus.</div>
        </div>
    </div>
</div>
Icon box Style 16
<article class="pbmit-miconheading-style-16">
    <div class="pbmit-ihbox pbmit-ihbox-style-16">
        <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-icon">
                <div class="pbmit-icon-wrapper pbmit-icon-type-icon">
                    <i class="pbmit-bexco-medical-icon pbmit-bexco-medical-icon-ambulance"></i>
                </div>
                </div>
            </div>
            <div class="pbmit-ihbox-contents">
                <h2 class="pbmit-element-title"> Emergency Care</h2>
                <div class="pbmit-heading-desc">Consectetur sed do eiusmod tempor labore dolore
                magna aliqua quis ullamco laboris aliquip.
                </div>
            </div>
        </div>
    </div>
</article>
Icon box Style 17
<div class="pbmit-ihbox pbmit-ihbox-style-17">
    <div class="pbmit-ihbox-box">
        <div class="pbmit-ihbox-icon">
            <div class="pbmit-ihbox-icon-wrapper pbmit-ihbox-icon-type-image">
                <img src="images/gardern/planing.png" alt="Landscape Designing">
            </div>
        </div>
        <div class="pbmit-ihbox-contents">
            <h2 class="pbmit-element-title">Landscape Designing</h2>
            <div class="pbmit-heading-desc">Some regions are more well-known than others based on production size, or wide-reaching.</div>
            <div class="pbmit-ihbox-btn pbmit-svg-btn">
                <a href="our-history.html">
                <span>learn more
                    <svg class="pbmit-svg-arrow" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" x="0px" y="0px" width="19" height="19" viewBox="0 0 19 19" xml:space="preserve">
                        <line x1="1" y1="18" x2="17.8" y2="1.2"></line>
                        <line x1="1.2" y1="1" x2="18" y2="1"></line>
                        <line x1="18" y1="17.8" x2="18" y2="1"></line>
                    </svg>
                </span>
                </a>
            </div>
        </div>
    </div>
</div>
Icon box Style 18
<div class="pbmit-ihbox pbmit-ihbox-style-18">
    <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-text">01.</div>
        </div>
        <div class="pbmit-ihbox-contents">
            <h2 class="pbmit-element-title">Premium Services Beyond You</h2>
        </div>
    </div>
</div>
Icon box Style 19
<div class="pbmit-ihbox pbmit-ihbox-style-19">
    <div class="pbmit-ihbox-box ">
        <h4 class="pbmit-element-heading"> Phone us 24/7 </h4>
        <div class="pbmit-box-content">
            <h2 class="pbmit-element-title"> 1-800-458-56987 </h2>
            <div class="pbmit-ihbox-icon">
                <div class="pbmit-ihbox-icon-wrapper">
                <div class="pbmit-icon-wrapper pbmit-icon-type-icon">
                    <i class="pbmit-bexco-architect-icon pbmit-bexco-architect-icon-phone-call"></i>
                </div>
                </div>
            </div>
        </div>
    </div>
</div>
Icon box Style 31
<div class="pbmit-ihbox pbmit-ihbox-style-31">
    <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-bexco-logistic-icon pbmit-bexco-logistic-icon-right-arrow"></i>
                </div>
            </div>
        </div>
        <svg xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" version="1.1" viewBox="0 0 200 200">
            <defs>
                <path d="M0, 100a100, 100 0 1, 0 200, 0a100, 100 0 1, 0 -200, 0" id="txt-path"></path>
            </defs>
            <text>
                <textPath startOffset="0" xlink:href="#txt-path">More About Us  -  More About Us  -  More About Us  -  More</textPath>
            </text>
        </svg>
    </div>
</div>
Icon box Style 32
<div class="pbmit-ihbox pbmit-ihbox-style-32">
    <div class="pbmit-ihbox-box">
        <div class="d-flex">
            <div class="pbmit-icon">
                <div class="pbmit-ihbox-icon">
                    <div class="pbmit-ihbox-icon-wrapper">
                        <div class="pbmit-icon-wrapper pbmit-icon-type-icon">
                            <i class="pbmit-bexco-digital-agency-icon pbmit-bexco-digital-agency-icon-paint-swatch"></i>
                        </div>
                    </div>
                </div>
            </div>
            <div class="pbmit-ihbox-contents">
                <h2 class="pbmit-element-title">Smooth Animation</h2>
                <div class="pbmit-heading-desc">Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece.</div>
            </div>
        </div>
    </div>
</div>
Icon box Style 34
<div class="pbmit-ihbox pbmit-ihbox-style-34">
    <div class="pbmit-ihbox-box d-flex align-items-center justify-content-between" data-cursor-text="VIEW">
        <div class="pbmit-ihbox-number">
            <div class="pbmit-text-number">
                <div class="pbmit-ihbox-icon">
                    <div class="pbmit-ihbox-icon-wrapper pbmit-ihbox-icon-type-text">2019</div>
                </div>
            </div>
        </div>
        <div class="pbmit-ihbox-heading">
            <h2 class="pbmit-element-title"> Best in Festival: New Work</h2>
            <div class="pbmit-element-subtitle">New York Design Week, New York</div>
        </div>
        <div class="pbmit-ihbox-contents">
            <div class="pbmit-heading-desc">Quis ipsum suspendisse ultrices gravida. Risus commodo viverra maecenas accumsan lacus vel facilisis. </div>
        </div>
        <div class="pbmit-svg-btn">
            <a class="btn-arrow" href="about-us.html">
                <svg class="pbmit-svg-arrow" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" x="0px" y="0px" width="19" height="19" viewBox="0 0 19 19" xml:space="preserve">
                    <line x1="1" y1="18" x2="17.8" y2="1.2"></line>
                    <line x1="1.2" y1="1" x2="18" y2="1"></line>
                    <line x1="18" y1="17.8" x2="18" y2="1"></line>
                </svg>
            </a>
        </div>
        <a class="pbmit-link" href="#"></a>
    </div>
</div>
Icon box Style 38
<div class="pbmit-ihbox pbmit-ihbox-style-38">
    <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-bexco-logistic-icon pbmit-bexco-logistic-icon-worldwide"></i>
                </div>
            </div>
        </div>
        <div class="pbmit-ihbox-contents">
            <h2 class="pbmit-element-title">Branches Across <span class="pbmit-globalcolor">The World 25+</span></h2>
            <div class="pbmit-heading-desc">Labore dolore magna aliqua enim ad min imveniam quis nostrud exercitation.</div>
        </div>
    </div>
</div>
Icon box Style 39
<article class="pbmit-miconheading-style-39">
    <div class="pbmit-ihbox pbmit-ihbox-style-39">
        <div class="pbmit-ihbox-box d-flex">
            <div class="pbmit-html-code-box">04</div>
                <div class="pbmit-ihbox-number">
                    <h2 class="pbmit-element-title">On Time Delivery</h2>
                </div>
            <div class="pbmit-ihbox-contents">
                <div class="pbmit-heading-desc">Labore dolore magna aliqua enim ad min imveniam quis nostrud exercitation.</div>
            </div>
            <div class="pbmit-ihbox-img">
                <div class="pbmit-ihbox-icon">
                    <div class="pbmit-ihbox-icon-wrapper pbmit-ihbox-icon-type-image">
                        <img src="images/logistics/logistic-hover-img-04.png" alt="" />
                    </div>
                </div>
            </div>
        </div>
    </div>
</article>
Icon box Style 40
<div class="pbmit-ihbox pbmit-ihbox-style-40">
    <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-bexco-logistic-icon pbmit-bexco-logistic-icon-right-arrow"></i>
                </div>
            </div>
        </div>
        <svg xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" version="1.1" viewBox="0 0 200 200">
            <defs>
                <path d="M0, 100a100, 100 0 1, 0 200, 0a100, 100 0 1, 0 -200, 0" id="txt-path"></path>
            </defs>
            <text>
                <textPath startOffset="0" xlink:href="#txt-path">See All member   -   See All member  -   See All member - See All member -</textPath>
            </text>
        </svg>
    </div>
</div>
Icon box Style 41
<div class="pbmit-ihbox pbmit-ihbox-style-41">
    <div class="pbmit-ihbox-box">
        <svg xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" version="1.1" viewBox="0 0 200 200">
            <defs>
                <path d="M0, 100a100, 100 0 1, 0 200, 0a100, 100 0 1, 0 -200, 0" id="txt-path"></path>
            </defs>
            <text>
                <textPath startOffset="0" xlink:href="#txt-path">Best Price Plan - Best Price Plan - Best Price Plan -</textPath>
            </text>
        </svg>
    </div>
</div>
Icon box Style 42
<div class="pbmit-ihbox pbmit-ihbox-style-42">
    <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-bexco-industry-icon pbmit-bexco-industry-icon-hand-drill"></i>
                </div>
            </div>
        </div>
        <div class="pbmit-ihbox-contents">
            <h2 class="pbmit-element-title">Innovative Product Solutions</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 43
<article class="pbmit-miconheading-style-43">
    <div class="pbmit-ihbox pbmit-ihbox-style-43">
        <div class="pbmit-ihbox-box">
            <div class="pbmit-ihbox-icon">
                <div class="pbmit-ihbox-icon-wrapper pbmit-ihbox-icon-type-text">3</div>
            </div>
            <div class="pbmit-ihbox-contents">
                <h2 class="pbmit-element-title">Ready Project</h2>
                <div class="pbmit-heading-desc">Phasellus urna felis, vehicula a ultricie imperdiet, vulputate ut mauris ac ultricies.</div>
            </div>
        </div>
    </div>
</article>

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-post-inner">
            <div class="pbmit-titlebox">
                <div class="pbminfotech-img-wrapper">
                    <div class="pbmit-icon-wrapper">
                        <i class="pbmit-bexco-icon pbmit-bexco-gardern-icon pbmit-bexco-gardern-icon-germination"></i>
                    </div>
                    <div class="pbmit-featured-img-wrapper">
                        <div class="pbmit-featured-wrapper">
                            <img src="images/gardern/service/gardn-service_01.jpg" class="img-fluid" alt="">
                        </div>
                    </div>
                </div>
                <div class="pbmit-titlebox-inner">
                    <h3 class="pbmit-service-title">
                        <a href="service-details.html">Home Gardening</a>
                    </h3>
                    <p> Gardens and nature can help you achieve the five ways to wellbeing. </p>
                </div>
            </div>
        </div>
    </div>
</article>
Service Box Style 2
<article class="pbmit-service-style-2">
    <div class="pbminfotech-post-item">
        <div class="pbmit-post-wrapper d-flex justify-content-between align-items-center">
            <div class="pbmit-post-inner">
                <div class="pbmit-titlebox">
                    <div class="pbminfotech-box-number">01</div>
                    <div class="pbmit-titlebox-inner">
                        <div class="pbmit-icon-wrapper">
                            <i class="pbmit-bexco-icon pbmit-bexco-lawyer-icon pbmit-bexco-lawyer-icon-passport"></i>
                        </div>
                        <div class="pbmit-serv-cat">
                            <a href="service-details.html" rel="tag">Hand over</a>
                        </div>
                        <h3 class="pbmit-service-title">
                            <a href="service-details.html">Criminal Defence</a>
                        </h3>
                    </div>
                </div>
            </div>
            <div class="pbmit-svg-btn">
                <a class="btn-arrow" href="service-details.html">
                    <svg class="pbmit-svg-arrow" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" x="0px" y="0px" width="19" height="19" viewBox="0 0 19 19" xml:space="preserve">
                        <line x1="1" y1="18" x2="17.8" y2="1.2"></line>
                        <line x1="1.2" y1="1" x2="18" y2="1"></line>
                        <line x1="18" y1="17.8" x2="18" y2="1"></line>
                    </svg>
                </a>
            </div>
        </div>
        <div class="pbmit-hover-img">
            <div class="pbmit-featured-img-wrapper">
                <div class="pbmit-featured-wrapper">
                    <img src="images/lawyer/service/law-service-01.jpg" class="img-fluid" alt="">
                </div>
            </div>
        </div>
        <a href="service-details.html" class="pbmit-link"></a>
    </div>
</article>
Service Box Style 5
<article class="pbmit-service-style-5">
    <div class="pbminfotech-post-item">
        <div class="pbmit-icon-wrapper">
            <i class="pbmit-bexco-icon pbmit-bexco-gym-icon pbmit-bexco-gym-icon-muscle"></i>
        </div>
        <h3 class="pbmit-service-title">
            <a href="service-details.html">High-Intensity</a>
        </h3>
        <div class="pbmit-hover-img">
            <div class="pbmit-featured-img-wrapper">
                <div class="pbmit-featured-wrapper">
                    <img src="images/gym/service/gym-service-01.jpg" class="img-fluid" alt="">
                </div>
            </div>
        </div>
    </div>
</article>
Service Box Style 6
<article class="pbmit-service-style-6">
    <div class="pbminfotech-post-item">
        <div class="pbmit-icon-wrapper">
            <i class="pbmit-bexco-icon pbmit-bexco-medical-icon pbmit-bexco-medical-icon-rubber-gloves"></i>
        </div>
        <h3 class="pbmit-service-title" data-text="Cardiology">
            <a href="service-details.html">Cardiology</a>
        </h3>
        <div class="pbmit-hover-img">
            <div class="pbmit-featured-img-wrapper">
                <div class="pbmit-featured-wrapper">
                <img src="images/medical/service/doctory-service-02.jpg" class="img-fluid" alt="">
                </div>
            </div>
        </div>
    </div>
</article>
Service Box Style 8
<article class="pbmit-service-style-8">
    <div class="pbminfotech-post-item">
        <div class="d-flex">
            <div class="pbminfotech-box-icon">
                <i class="pbmit-bexco-software-icon pbmit-bexco-software-icon-product-return"></i>        
            </div>
            <div class="pbmit-service-content-wrap">
                <h3 class="pbmit-service-title">
                    <a href="service-details.html">Social Media Marketing</a>
                </h3>
            </div>
        </div>
        <div class="pbmit-service-content">
            <p>A strong social media marketing strategy increases brand awareness</p>
        </div>
        <div class="pbmit-service-description">
            <ul>
                <li><i class="pbmit-base-icon-check-solid"></i> Video Production</li>
                <li><i class="pbmit-base-icon-check-solid"></i> Writing</li>
                <li><i class="pbmit-base-icon-check-solid"></i> Community management</li>
            </ul>
        </div>
    </div>
</article>
Service Box Style 9
<article class="pbmit-service-style-9">
    <div class="pbminfotech-post-item">
        <div class="pbminfotech-box-content d-flex align-items-center">
            <div class="pbmit-titlebox d-flex">
                <div class="pbminfotech-box-number">01</div>
                <h3 class="pbmit-service-title"><a href="service-details.html">Digital Strategy</a></h3>
            </div>
            <div class="pbmit-service-image-wrapper">
                <div class="pbmit-featured-img-wrapper">
                <div class="pbmit-featured-wrapper">   
                    <img src="images/digital-agency/service/service-01.jpg" class="img-fluid" alt="" />
                </div>
                </div>
            </div>
            <div class="pbmit-contentbox d-flex align-items-center">
                <div class="pbmit-service-content">
                <p>10-to-30-second audio ads played periodically during breaks between content</p>
                </div>
                <div class="pbmit-svg-btn">
                <a class="btn-arrow" href="service-details.html">
                    <svg class="pbmit-svg-arrow" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" x="0px" y="0px" width="19" height="19" viewBox="0 0 19 19" xml:space="preserve">
                        <line x1="1" y1="18" x2="17.8" y2="1.2"></line>
                        <line x1="1.2" y1="1" x2="18" y2="1"></line>
                        <line x1="18" y1="17.8" x2="18" y2="1"></line>
                    </svg>
                </a>
                </div>
            </div>
        </div>
    </div>
</article>
Service Box Style 10
<article class="pbmit-service-style-10">
    <div class="pbminfotech-post-item">
        <div class="pbminfotech-post-item-inner">
            <div class="pbminfotech-box-content">
                <div class="pbminfotech-box-content-inner">
                    <div class="pbmit-serv-cat">
                        <a href="service-details.html" rel="tag">Strategy</a></div>
                    <h3 class="pbmit-service-title">
                        <a href="service-details.html">Resiliency Consulting</a>
                    </h3>
                    <div class="pbmit-service-content">
                        <p>Deliver great customer experiences that increase loyalty and decrease costs.</p>
                    </div>
                    <div class="pbmit-svg-btn">
                        <a class="btn-arrow" href="service-details.html">
                            <span>Read More					
                                <svg class="pbmit-svg-arrow" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" x="0px" y="0px" width="19" height="19" viewBox="0 0 19 19" xml:space="preserve">
                                    <line x1="1" y1="18" x2="17.8" y2="1.2"></line>
                                    <line x1="1.2" y1="1" x2="18" y2="1"></line>
                                    <line x1="18" y1="17.8" x2="18" y2="1"></line>
                                </svg>
                            </span>
                        </a>
                    </div>
                </div>
                <div class="pbminfotech-icon-box">
                    <i class="pbmit-bexco-consulting-icon pbmit-bexco-consulting-icon-advanced-training"></i>			
                </div>
            </div>
        </div>
    </div>
</article>
Service Box Style 12
<article class="pbmit-service-style-12">
    <div class="pbminfotech-post-item">
        <div class="pbmit-service-img-wrapper" style="background-image:url('images/logistics/service/service-03.jpg')">
            <div class="pbmit-featured-img-wrapper">
                <div class="pbmit-featured-wrapper">
                <img src="images/logistics/service/service-03.jpg" class="img-fluid" alt="" />
                </div>
            </div>
        </div>
        <div class="pbminfotech-box-content">
            <div class="pbminfotech-box-number">03</div>
            <h3 class="pbmit-service-title">
                <a href="service-details.html">Road Freight</a>
            </h3>
            <div class="pbmit-svg-btn">
                <a class="btn-arrow" href="service-details.html">
                <i class="pbmit-base-icon-right-arrow-2"></i>
                </a>
            </div>
        </div>
        <div class="pbminfotech-icon-box">
            <i class="pbmit-bexco-logistic-icon pbmit-bexco-logistic-icon-delivery-box"></i>	
        </div>
    </div>
</article>
Service Box Style 13
<article class="pbmit-service-style-13 ">
    <div class="pbminfotech-post-item">
        <div class="pbminfotech-post-item-inner">
            <div class="pbminfotech-box-content">
                <div class="pbminfotech-icon-box">
                <i class="pbmit-bexco-industry-icon pbmit-bexco-industry-icon-solar-panel"></i>			
                </div>
                <h3 class="pbmit-service-title">
                <a href="service-details.html">Research Manufacture</a>
                </h3>
                <div class="pbmit-service-content">
                <p>The hospitality industry includes hotels, restaurants and bars.</p>
                </div>
            </div>
            <div class="pbmit-featured-img-wrapper">
                <div class="pbmit-featured-wrapper">
                <img src="images/industry/Service/service1.jpg" class="img-fluid" alt="" />
                </div>
            </div>
        </div>
    </div>
</article>

Progress Bar

Use the below code to display Progress Bar style: 

<div class="progressbar">
    <span class="progress-label">Marketing</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="83" aria-valuemin="0" aria-valuemax="100"
          style="width:83%">
       </div>
       <span class="progress-percent">83%</span>
    </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="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/architect/team/team-01.jpg" class="img-fluid" alt="">
                </div>
            </div>
        </div>
        <div class="pbminfotech-box-content">
            <h3 class="pbmit-team-title">
                <a href="team-single-detail.html">Lucienne Hansen</a>
            </h3>
            <div class="pbminfotech-box-team-position">Senior Adviser</div>
        </div>
    </div>
</article>
Team Style 2
<article class="pbmit-team-style-2">
    <div class="pbminfotech-post-item">
        <div class="pbmit-image-wrapper">
            <div class="pbmit-featured-img-wrapper">
                <div class="pbmit-featured-wrapper">
                <img src="images/lawyer/team/law-team-01.jpg" class="img-fluid" alt="">
                </div>
            </div>
            <div class="pbminfotech-social-box">
                <div class="pbminfotech-box-social-links">
                <div class="pbmit-social-inner">
                    <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>
        </div>
        <div class="pbminfotech-box-content">
            <div class="pbminfotech-titlebox">
                <h3 class="pbmit-team-title">Lily Watson</h3>
                <div class="pbminfotech-team-position">
                <div class="pbminfotech-box-team-position">Manager</div>
                </div>
            </div>
        </div>
        <a class="pbmit-link" title="" href="team-single-detail.html"></a>
    </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/medical/team/doctory-team-02.jpg" class="img-fluid" alt="">
            </div>
        </div>
        <div class="pbminfotech-box-content">
            <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-titlebox">
                <h3 class="pbmit-team-title">
                <a href="team-single-detail.html">Michael Harper</a>
                </h3>
                <div class="pbminfotech-box-team-position">Marketing Officer</div>
            </div>
        </div>
    </div>
</article>
Team Style 7
<article class="pbmit-team-style-7">
    <div class="pbminfotech-post-item">
        <div class="pbmit-featured-img-wrapper">
            <div class="pbmit-featured-wrapper">
                <img src="images/team/mrkt-team-02.jpg" class="img-fluid" alt="">
            </div>
        </div>
        <div class="pbminfotech-box-content">
            <div class="pbminfotech-box-team-position">Senior worker</div>
            <h3 class="pbmit-team-title">
                <a href="team-single-detail.html">Philly Reps</a>
            </h3>
            <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>
</article>
Team Style 9
<article class="pbmit-team-style-9">
    <div class="pbminfotech-post-item">
        <div class="pbmit-featured-img-wrapper">
            <div class="pbmit-featured-wrapper">
                <img src="images/logistics/team/team1.jpg" class="img-fluid" alt="" />
            </div>
        </div>
        <div class="pbminfotech-box-content">
            <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-linkedin">
                    <a href="#" title="LinkedIn" target="_blank">
                        <span><i class="pbmit-base-icon-linkedin-squared"></i></span>
                    </a>
                </li>
                </ul>
            </div>
            <div class="pbmit-titlebox">
                <div class="pbminfotech-box-team-position">Logistics manager</div>
                <h3 class="pbmit-team-title"><a href="team-single-detail.html">Norton Berry</a></h3>
            </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">
                    <div class="at-above-post-homepage addthis_tool"></div>
                        <p>“I hired employees for my design work, theni hired for my entry. They helped me in design It’s gone to amazing , beautiful and they did fantastic job for me!”</p>
                    <div class="at-below-post-homepage addthis_tool"></div>
                </blockquote>
            </div>
            <div class="pbminfotech-author-wrapper d-flex">
                <div class="pbminfotech-box-img">
                    <div class="pbmit-featured-img-wrapper">
                        <div class="pbmit-featured-wrapper">
                            <img src="images/marketing/testimonial/testimonial-img-01.jpg" class="img-fluid" alt="">
                        </div>
                    </div>
                </div>
                <div class="pbminfotech-box-author">
                    <h3 class="pbminfotech-box-title">Jennifer lopez</h3>
                    <div class="pbminfotech-testimonial-detail">SEO</div>
                </div>
            </div>
        </div>
    </div>
</article>
Testimonial Style 2
<article class="pbmit-testimonial-style-2">
    <div class="pbminfotech-post-item">
        <div class="pbminfotech-box-content d-flex">
            <div class="pbminfotech-testimonial-wrapper">
                <div class="pbminfotech-box-desc">
                    <blockquote class="pbminfotech-testimonial-text">
                        <div class="at-above-post-homepage addthis_tool"></div>
                        <p>“Unfortunately, I have experienced two divorces in my life. Lawfirm Best has assisted me with my child custody and child support cases. He is absolutely fantastic and did a great job. I highly recommend him for work!”</p>
                        <div class="at-below-post-homepage addthis_tool"></div>
                    </blockquote>
                </div>
                <div class="pbminfotech-author-wrapper d-flex">
                    <div class="pbminfotech-box-img">
                        <div class="pbmit-featured-img-wrapper">
                            <div class="pbmit-featured-wrapper">
                                <img src="images/lawyer/testimonial/testimonial-img-01.jpg" class="img-fluid" alt="">
                            </div>
                        </div>
                    </div>
                    <div class="pbminfotech-box-author">
                        <h3 class="pbminfotech-box-title">Jennifer lopez</h3>
                        <div class="pbminfotech-testimonial-detail">Advocate</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</article>
Testimonial Style 3
<article class="pbmit-testimonial-style-3">
    <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/construction/testimonial/testimonial-img-01.jpg" class="img-fluid" alt="">
                </div>
            </div>
        </div>
        <div class="pbminfotech-box-content">
            <div class="pbminfotech-testimonial-wrapper">
                <div class="pbminfotech-box-desc">
                    <blockquote class="pbminfotech-testimonial-text">
                        <div class="at-above-post-homepage addthis_tool"></div>
                        <p>“It was really great working with Architect team and I am happy I was introduced to this team! It’s not easy to work on a website some one else I am grateful that Architect team.”</p>
                        <div class="at-below-post-homepage addthis_tool"></div>
                    </blockquote>
                </div>
                <div class="pbminfotech-author-wrapper ">
                    <div class="pbminfotech-box-author">
                        <h3 class="pbminfotech-box-title">Fabiana Winds</h3>
                        <div class="pbminfotech-testimonial-detail">Co-Founder, Director</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</article>
Testimonial Style 4
<article class="pbmit-testimonial-style-4">
    <div class="pbminfotech-post-item">
        <div class="pbminfotech-box-content">
            <div class="pbminfotech-box-desc">
                <blockquote class="pbminfotech-testimonial-text">
                    <div class="at-above-post-homepage addthis_tool"></div>
                    <p>“I hired employees for my design work, theni hired for my entry. They helped me in design with full attention’s It’s gone to amazing  , beautiful and they did fantastic job for me!”</p>
                    <div class="at-below-post-homepage addthis_tool"></div>
                </blockquote>
            </div>
            <div class="pbminfotech-author-wrapper ">
                <div class="pbminfotech-box-author">
                    <h3 class="pbminfotech-box-title">Jennifer lopez</h3>
                    <div class="pbminfotech-testimonial-detail">Manager</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-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"></i>
                <i class="pbmit-base-icon-star"></i>
            </div>
            <div class="pbminfotech-box-desc">
                <blockquote class="pbminfotech-testimonial-text">
                    <div class="at-above-post-homepage addthis_tool"></div>
                    <p>“We had a wonderful experience working with Conceptions. Dr. Jennifer and everyone we came into contact with were so warm, inviting, knowledgeable, and reassuring. They treet you like you are their most important patient. Thanks, Jennifer and team. We will forever be grateful!”</p>
                    <div class="at-below-post-homepage addthis_tool"></div>
                </blockquote>
            </div>
            <div class="pbminfotech-author-wrapper ">
                <div class="pbminfotech-box-author">
                    <h3 class="pbminfotech-box-title">Alex Zender</h3>
                    <div class="pbminfotech-testimonial-detail">Co-Founder, Director</div>
                </div>
            </div>
        </div>
    </div>
</article>
Testimonial Style 6
<article class="pbmit-testimonial-style-6">
    <div class="pbminfotech-post-item d-flex">
        <div class="pbminfotech-box-content">
            <div class="pbminfotech-box-img">
                <div class="pbmit-featured-img-wrapper">
                    <div class="pbmit-featured-wrapper">
                        <img src="images/gardern/testimonial/testimonial-img-02.jpg" class="img-fluid" alt="">
                    </div>
                </div>
            </div>
            <div class="pbminfotech-author-wrapper ">
                <div class="pbminfotech-box-author">
                    <h3 class="pbminfotech-box-title">Alexa Zender</h3>
                    <div class="pbminfotech-testimonial-detail">- world-famous magician</div>
                </div>
            </div>
        </div>
        <div class="pbminfotech-testimonial-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"></i>
            </div>
            <blockquote class="pbminfotech-testimonial-text">
                <div class="at-above-post-homepage addthis_tool"></div>
                <p>“Our office is something we are pleased. We consider it to the little magnet; it is wanting to come here and afterward that difficult to leave it that office. Our office is additionally a big name.”</p>
                <div class="at-below-post-homepage addthis_tool"></div>
            </blockquote>
        </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-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-desc">
                <blockquote class="pbminfotech-testimonial-text">
                    <p>“I hired employees for my design work, theni hired for my entry. beautiful and they did fantastic job for me! It was really great working with Architchteam and I am happy I was introduced to this team!”</p>
                </blockquote>
            </div>
            <div class="pbminfotech-author-wrapper d-flex">
                <div class="pbminfotech-box-img">
                    <div class="pbmit-featured-img-wrapper">
                        <div class="pbmit-featured-wrapper">
                            <img src="images/testimonial/testimonial-img-02.jpg" class="size-thumbnail" alt="" />
                        </div>
                    </div>
                </div>
                <div class="pbminfotech-box-author">
                    <h3 class="pbminfotech-box-title">Jennifer lopez</h3>
                    <div class="pbminfotech-testimonial-detail">Co-Founder, Director</div>
                </div>
            </div>
        </div>
    </div>
</article>
Testimonial Style 9
<article class="pbmit-testimonial-style-9 swiper-slide">
    <div class="pbminfotech-post-item">
        <div class="pbmit-content-wrap">
            <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-desc">
                <blockquote class="pbminfotech-testimonial-text">
                    <p>“I hired employees for my design work, theni hired for my entry. beautiful and they did fantastic job for me! It was really great working with Architchteam and I am happy I was introduced to this team!”</p>
                </blockquote>
            </div>
        </div>
        <div class="pbminfotech-author-wrapper d-flex">
            <div class="pbminfotech-box-img">
                <div class="pbmit-featured-img-wrapper">
                    <div class="pbmit-featured-wrapper">
                        <img src="images/testimonial/testimonial-img-02.jpg" class="img-fluid" alt="" />
                    </div>
                </div>
            </div>
            <div class="pbminfotech-box-author">
                <h3 class="pbminfotech-box-title">Fabiana Winds</h3>
                <div class="pbminfotech-testimonial-detail">Director</div>
            </div>
        </div>
    </div>
</article>
Testimonial Style 10
<article class="pbmit-testimonial-style-10">
    <div class="pbminfotech-post-item">
        <div class="pbminfotech-box-content d-flex align-items-center">
            <div class="pbminfotech-box-img">
                <div class="pbmit-featured-img-wrapper">
                    <div class="pbmit-featured-wrapper">
                        <img src="images/testimonial/testimonial-img-02.jpg" class="img-fluid" alt="" />
                    </div>
                </div>
            </div>
            <div class="pbmit-content-wrap">
                <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 "></i>
                </div>
                <div class="pbminfotech-box-desc">
                    <blockquote class="pbminfotech-testimonial-text">
                        <p>“It was really great working with Mobiteam and I am happy I was introd uced to this team! It’s not easy to work on a website some one else started and I am grateful that Mobiteam took challenge.”</p>
                    </blockquote>
                </div>
                <div class="pbminfotech-box-author d-flex justify-content-between align-items-center">
                    <h3 class="pbminfotech-box-title">Justin Beckham</h3>
                    <div class="pbminfotech-testimonial-detail">Co-Founder, Director</div>
                    <div class="pbminfotech-star-ratings-text">Read full feedback</div>
                </div>
            </div>
        </div>
    </div>
</article>
Testimonial Style 11
<article class="pbmit-testimonial-style-11 swiper-slide">
    <div class="pbminfotech-post-item">
        <div class="pbminfotech-box-content">
            <div class="pbminfotech-box-desc">
                <blockquote class="pbminfotech-testimonial-text">
                    <p>“Nest Construction is a leading construction company in Melbourne, building new homes and commercial projects that are durable, functional and beautiful”</p>
                </blockquote>
            </div>
            <div class="pbminfotech-author-wrapper d-flex">
                <div class="pbminfotech-box-img">
                    <div class="pbmit-featured-img-wrapper">
                        <div class="pbmit-featured-wrapper">
                            <img src="images/testimonial/testimonial-img-03.jpg" class="img-fluid" alt="" />
                        </div>
                    </div>
                </div>
                <div class="pbminfotech-box-author">
                    <h3 class="pbminfotech-box-title">Jennifer lopez</h3>
                    <div class="pbminfotech-testimonial-detail">Manager</div>
                </div>
            </div>
        </div>
    </div>
</article>
Testimonial Style 12
<article class="pbmit-testimonial-style-12 swiper-slide">
    <div class="pbminfotech-post-item">
        <div class="pbminfotech-author-wrapper d-flex">
            <div class="pbminfotech-box-img">
                <div class="pbmit-featured-img-wrapper">
                    <div class="pbmit-featured-wrapper">
                        <img src="images/testimonial/testimonial-img-01.jpg" class="img-fluid" alt="" />
                    </div>
                </div>
                <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"></i>
                </div>
            </div>
            <div class="pbmit-box-content">
                <div class="pbminfotech-box-desc">
                    <blockquote class="pbminfotech-testimonial-text">
                        <p>“Our office is something we are pleased with. We consider it the little magnet; great working team! It was amazing. it is wanting to come & afterward difficult to leave it. Our office is additionally a big name.”</p>
                    </blockquote>
                </div>
                <div class="pbminfotech-box-author d-flex align-items-center">
                    <h3 class="pbminfotech-box-title">Bobby Flay</h3>
                    <div class="pbminfotech-testimonial-detail">Manager</div>
                </div>
            </div>
        </div>
    </div>
</article>
Testimonial Style 13
<article class="swiper-slide pbmit-testimonial-style-13">
    <div class="pbminfotech-post-item">
        <div class="pbminfotech-author-wrapper">
            <div class="pbminfotech-box-img">
                <div class="pbmit-featured-img-wrapper">
                    <div class="pbmit-featured-wrapper">
                        <img src="images/testimonial/testimonial-img-02.jpg" class="img-fluid" alt="" />
                    </div>
                </div>
                <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="pbmit-box-content">
                <div class="pbminfotech-box-desc">
                    <blockquote class="pbminfotech-testimonial-text">
                        <p>“It was really great working with Mobiteam and I am happy I was introd uced to this team! It’s not easy to work on a website some one else started and I am grateful that Mobiteam took challenge.”</p>
                    </blockquote>
                </div>
                <div class="pbminfotech-box-author">
                    <h3 class="pbminfotech-box-title">Fabiana Winds</h3>
                    <div class="pbminfotech-testimonial-detail">Co-Founder, Director</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: https://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



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.